1:引入需要的js与css
<script src="jquery-easyui-1.3.5/jquery.min.js"></script>
<script src="jquery-easyui-1.3.5/jquery.easyui.min.js"></script>//easyui核心文件
<script src="jquery-easyui-1.3.5/locale/easyui-lang-zh_CN.js"></script>//国际化
<link href="jquery-easyui-1.3.5/themes/default/easyui.css" rel="stylesheet" />//主题文件
<link href="jquery-easyui-1.3.5/themes/icon.css" rel="stylesheet" />//主题使用的图标
2:构造easy ui 控件
js方式
首先建立一个div标签
<div id="myd">Dialog Content.</div>
然后选择div调用dialog就可以把普通的div渲染成easy ui的dialog控件
$(function () {
$("#myd").dialog({
width: 200,
height: 300,
title:"mydialog"
});
})
html方式效果一样
<div id="dd" class="easyui-dialog" title="My Dialog" style="width:200px;height:300px;">
Dialog Content.
</div>
3:使用easyui-validatebox
easyui-validatebox是和easy ui的form一起使用的,在提交的使用easy ui 会自己调用validate方法验证,
所以我们在使用自己的ajax提交时需要手动调用validate方法验证一次
if ($("#myForm").form("validate"))
{ login(); }
4:使用layout
layout是由上下左右中的5的panel组成
获得中间的panel
var p = $("#layout").layout('panel', "center");
获得中间panel属性中的title
p.panel("options").title
属性href是嵌入一个html页面,但只渲染body部分
所以为了简洁全部删除直接写代码就相当于在body部分写代码
5:常用的属性
fit一般要做控件之间的改变而改变都要设置fit为true
6:commobox取值
.combobox('getValue')
.combobox('getTest')