目录
1Accordion(可折叠标签) (3)
1.1实例 (3)
1.2参数 (4)
2DateBox(日期框) (4)
2.1实例 (4)
2.2参数 (7)
2.3事件 (7)
2.4方法 (7)
3ComboBox(组合框) (7)
3.1实例 (7)
3.2参数 (9)
3.3事件 (10)
3.4方法 (10)
4Dialog(对话框) (10)
4.1实例 (10)
4.2参数 (12)
4.3事件 (13)
4.4方法 (13)
5Messager(提示框) (13)
5.1实例 (13)
5.2方法 (16)
5.3扩展 (17)
6NumberBox(数字框) (17)
6.1实例 (17)
6.2参数 (18)
7ValidateBox(验证框) (18)
7.1实例 (18)
7.2参数 (20)
7.3方法 (20)
7.4扩展 (21)
8Pagination(分页) (21)
8.1实例 (21)
8.2参数 (23)
8.3事件 (23)
9Window(窗口) (23)
9.1实例 (24)
9.2参数 (26)
9.3事件 (26)
9.4方法 (26)
10Panel(面板) (26)
10.1实例 (27)
10.2参数 (28)
10.3事件 (29)
10.4方法 (30)
11Tabs(标签) (30)
11.1实例 (30)
11.2参数 (33)
11.3事件 (33)
11.4方法 (33)
11.5标签面板属性 (33)
12Tree(树) (34)
12.1实例 (34)
12.2参数 (37)
12.3事件 (37)
12.4方法 (38)
13Layout(布局) (38)
13.1实例 (38)
13.2参数 (40)
13.3方法 (40)
14Datagrid(数据表) (40)
14.1实例 (40)
14.2参数 (44)
14.3Column参数 (45)
14.4事件 (46)
14.5方法 (47)
1Accordion(可折叠标签)
1.1实例
1.1.1代码
<html>
<head>
<meta http-equiv="Content-Type"content="text/html; charset=UTF-8">
<title>jQuery EasyUI</title>
<link rel="stylesheet"type="text/css"href="../themes/default/easyui.css">
<link rel="stylesheet"type="text/css"href="../themes/icon.css">
<script type="text/javascript"src="../jquery-1.4.2.min.js"></script>
<script type="text/javascript"src="../jquery.easyui.min.js"></script>
<script type="text/javascript">
$( function() {
$('#aa').accordion( {
width : 400,
height : 200,
fit : false
});
});
</script>
</head>
<body>
<div id="aa"border="true">
<div title="Title1"icon="icon-save" > <h3>Accordion for jQuery</h3>
<p>Accordion is a part of easyui framework for jQuery. It lets you define your accordion component on web page more easily.</p>
</div>
<div title="Title2"icon="icon-reload"selected="true"
>content2</div>
<div title="Title3">content3</div>
</div>
</body>
</html>
1.1.2效果图
1.1.3 扩展
实例html代码中
<div id="aa"border="true">
此行也可写成
<div id="aa" class="easyui-accordion" fit="false" border="false">
,并且将js代码全部去掉,效果图是一样的。
1.2参数
1.2.1容器参数
1.2.2面板参数
可折叠标签面板继承自面板(panel),许多属性定义在<div />标签里,下面的属性就是如此:
2DateBox(日期框)
2.1实例
2.1.1代码
<!DOCTYPE html PUBLIC"-//W3C//DTD HTML 4.01 Transitional//EN"
"/TR/html4/loose.dtd">
<html>
jquery官方文档下载<head>
<meta http-equiv="Content-Type"content="text/html; charset=gb2312">
<title>jQuery EasyUI</title>
<link rel="stylesheet"type="text/css"
href="../themes/default/easyui.css">
<link rel="stylesheet"type="text/css"href="../themes/icon.css">
<script type="text/javascript"src="../jquery-1.4.2.min.js"></script> <script type="text/javascript"src="../jquery.easyui.min.js"></script> <script>
function disable() {
$('#dd').datebox('disable');
}
function enable() {
$('#dd').datebox('enable');
}
/*
将Date/String类型,解析为String类型.
传入String类型,则先解析为Date类型
不正确的Date,返回 ''
如果时间部分为0,则忽略,只返回日期部分.
*/
function formatDate(v) {
if (v instanceof Date) {
var y = v.getFullYear();
var m = v.getMonth() + 1;
var d = v.getDate();
var h = v.getHours();
var i = v.getMinutes();
var s = v.getSeconds();
var ms = v.getMilliseconds();
if (ms > 0)
return y + '-' + m + '-' + d + ' ' + h + ':' + i + ':' + s
+ '.' + ms;
if (h > 0 || i > 0 || s > 0)
return y + '-' + m + '-' + d + ' ' + h + ':' + i + ':' + s;
return y + '-' + m + '-' + d;
}
return'';
}

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。