jQuery EasyUI是什么？
jQuery EasyUI是一组基于jQuery的UI插件集合体，而jQuery EasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面。开发者不需要编写复杂的javascript，也不需要对css样式有深入的了解，开发者需要了解的只有一些简单的html标签。
说白了就是为我们后端开发者打造的前端神器，我们不用去写复杂的javascript代码，也不用对CSS有深入的了解，只要能看懂和修改html就可以做出漂亮的页面，是不是感觉很爽。
定义：基于Jquery的UI插件集合
功能：打造功能丰富并且美观的UI界面
jQuery EasyUI有哪些好处呢？
1、基于Jquery用户界面插件的集合
2、为一些当前用于交互的js应用提供必要的功能
3、EasyUI支持两种渲染方式分别为javascript方式和html标记的方式（如：class="easyui-textbox"）
4、支持HTML5（通过data-option属性）
5、开发者可以节省大量的时间
6、支持扩展，可以根据自己的需要来进行扩展控件
吐槽： 刚刚毕业的时候我记得当年那家公司让我做样式，写CSS，我当时就蒙了，这尼玛我应聘的是.Net开发，你这是闹哪样让我写CSS脑子让驴给亲了，毕竟刚刚毕业，让干啥干啥呗，嫁鸡随鸡，嫁狗随狗呗。别提有多痛苦。。都是泪~~幸好我对面是个美女，我就成天对着她以泪洗面~~~~~~~~~~~~
JquerEasyUI英文网站：http://www.jeasyui.com/
JquerEasyUI中文网站：http://www.jeasyui.net/
本人整理jQuery EasyUI 1.4.1 离线简体中文API文档 含完整开发工具包+皮肤+扩展+演示：http://pan.baidu.com/s/1bn6SKZ9
接下来我们实践一个dataGridView的数据控件
1：导入需要的文件包到项目里面，一个是themes里的内容，和js文件
2：引入文件（路径复制完了之后改成自己的，千万别忘了改路径）
<link href="~/Content/EasyUI/themes/default/easyui.css" rel="stylesheet" /> <link href="~/Content/EasyUI/themes/icon.css" rel="stylesheet" /> <script src="~/Scripts/jquery.min.js"></script> <script src="~/Scripts/jquery.easyui.min.js"></script>
3：添加script代码（handler）
<script type="text/javascript"> $(function(){ var pager = $('#dg').datagrid().datagrid('getPager'); // get the pager of datagrid pager.pagination({ buttons:[{ iconCls:'icon-search', handler:function(){ alert('search'); } },{ iconCls:'icon-add', handler:function(){ alert('add'); } },{ iconCls:'icon-edit', handler:function(){ alert('edit'); } }] }); }) </script>
4：然后呢修改body代码（这里要说的就是url那里，加载当前页面之后Easyui会异步加载json数据，url地址就是异步加载数据的地址）
<body> <!------------------------------dataGrid Start id=dg----------------------------------------------> <div> <table id="dg" title="用户管理" style=" 700px; height: 250px" data-options="rownumbers:true,singleSelect:true,pagination:true,url:'/Home/GetListData',method:'get'"> <thead> <tr> <th data-options="field:'ID',80">ID</th> <th data-options="field:'UName',100">用户名</th> <th data-options="field:'UPwd',80,align:'right'">密码</th> <th data-options="field:'Remark',80,align:'right'">备注</th> </tr> </thead> </table> </div> </body>
5：页面就显示了，接下来我们根据自己的需求再对代码按照自己的需求进行更改；
如果有错误的地方请大家指出，希望能与大家多多交流，有什么问题也可以与我联系，谢谢；