最近做一个小工具,列表显示页面准备使用JQuery的UI框架,因为之前知道有jQWidgets这个框架,所以直接就下载下来使用了,jQWidgets的功能很强大,Demo和文档也非常详细,但使用后发现有几个问题就果断放弃了使用jQWidgets: 页面加载速度比较慢;
当列表字段过多出现横向滚动条时,拖动滚动条非常卡(在IE下都很卡,Chrome好点);
分页取数稍显麻烦,也可能是我没研究透.
经过一番比较选择了JQueryEasUI,目前最新版本为1.3.1:
其实是用类似的框架,看看官网的文档也就OK了,本文是我最近是用JQueryEasyUI的一个总结,也可以让初使用JQueryEasyUI的朋友少走弯路.
下载引用
下载后解压的文件目录如下图:
demo:JQueryEasyUI的一些示例页面,在项目使用可以将该目录删除;
locale:该目录中是一些本地化文件,用来支持不同的语言,如中文可以引用其中的easyui-lang-zh_CN.js;
plugins和src:这两个目录中是支持JQueryEasyUI各种功能的js文件;
themes:主题目录,目录中有三种主题,default、gray和metro,另外还有一个icons目录和icon.css,在页面使用引用icon.css即可.
使用JQueryEasyUI需要引用四个文件,两个css和两个js文件:
<link rel=“stylesheet” type=“text/css” href=“../Scripts/jqueryeasyui/themes/gray/easyui.css” />
<link rel=“stylesheet” type=“text/css” href=“../Scripts/jqueryeasyui/themes/icon.css” />
<script type=“text/javascript” src=“../Scripts/jqueryeasyui/jquery-1.8.0.min.js”></script>
<script type=“text/javascript” src=“../Scripts/jqueryeasyui/jquery.easyui.min.js”></script>