hello,大家好,我依旧是你们的好朋友-求哥的马子,今天给大家推荐好用的 esyui
1、easyui是什么东西?
easyui是一种基于jQuery的用户界面插件集合。
easyui为创建现代化,互动,JavaScript应用程序,提供必要的功能。
使用easyui你不需要写很多代码,你只需要通过编写一些简单HTML标记,就可以定义用户界面。
easyui是个完美支持HTML5网页的完整框架。
easyui节省您网页开发的时间和规模。
easyui很简单但功能强大的。
2、官方网址
http://www.jeasyui.net/
下载
http://www.jeasyui.com/download/list.php
案列一:使用esyui 完成简单的页面布局
实现思路:新建一个动态web项目,导入需要的esyui 包,新建 jsp 页面,在页面导入寻要的包
(如果很多页面需要用到同样的几个包,可以将它封装到一个页面里)
主界面
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@ include file="common/head.jsp"%><!-- 此处调用所需的包 -->
<title>Insert title here</title>
</head>
<body class="easyui-layout" >
<div data-options="region:'north',title:'网上书城后台管理系统',split:true" style="height:100px;"></div>
<div data-options="region:'west',title:'功能导航',split:true" style="width:100px;"></div>
<div data-options="region:'center',title:'center title'" style="padding:5px;background:#eee;"></div>
<div data-options="region:'south',split:true" style=" text-align:center;background: #E0ECFF;height:30px;" class="panel-title">
Copyright@求哥的马子有限责任公司
</div>
</body>
</html>
封装的界面
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
request.setAttribute("ctx", request.getContextPath());/* 全局变量 上下文参数 */
%>
<script type="text/javascript" src="${ctx }/js/jquery-easyui-1.5.5.2/jquery.min.js"></script>
<script type="text/javascript" src="${ctx }/js/jquery-easyui-1.5.5.2/jquery.easyui.min.js"></script>
<script type="text/javascript" src="${ctx }/js/jquery-easyui-1.5.5.2/locale/easyui-lang-zh_CN.js"></script>
<link rel="stylesheet" type="text/css" href="${ctx }/js/jquery-easyui-1.5.5.2/themes/default/easyui.css"/>
<link rel="stylesheet" type="text/css" href="${ctx }/js/jquery-easyui-1.5.5.2/themes/icon.css"/>
<script type="text/javascript">
var ctx = '${ctx}';//调用
</script>
代码简单绝对,求哥简单纯粹,每天都要开心哦
好了,到这就结束了,感谢观看