本文主要内容是介绍EasyUI的一些常用组件的使用，都是一些非常基础的知识，适合入门者学习，主要包括Base（基础）、Layout(布局）、菜单和按钮、表单、窗口、表格和树等的使用。要求完全掌握这些内容，学会查阅文档，了解开发基本思想。如果想进一步深入学习，可以直接去官网进行学习，查阅文档等http://www.jeasyui.com/。
一、简介
EasyUI是一种第三方组织开发的，开源的，功能强大的，基于jquery的插件库。 主要可以用于web的后台前端。jQuery EasyUI 提供易于使用的组件，它使 Web 开发人员能快速地在流行的 jQuery 核心和 HTML5 上建立程序页面。 这里介绍的都是一些基本组件，项目中需要将其装配起来，方可构建完整的web页面，EasyUI只是众多前端WEB组件之一。
作用：快速基于现成的组件创建自己的web页面。组件：指已经有第三方写好的，直接可以使用的功能界面，例如：form,layout,tree等。
二、开发步骤
1、先去官网下载相应的插件：
2、在myeclipse中新建一个web工程
3、在WebRoot目录下创建js和themes目录，导入官方文件
4、新建一个helloword.html的网页，并引入下列文件：
<link rel="stylesheet" href="themes/default/easyui.css" type="text/css" />
<link rel="stylesheet" href="themes/icon.css" type="text/css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="js/easyui-lang-zh_CN.js"></script>文件引入的顺序不要错，那么到目前为止，开发的准备工作就已经完成了。
三、Base组件的使用
3.1 Pagination（分页）
使用$.fn.pagination.defaults重写默认值对象
.分页组件是一个比较常用的组件之一，我们可以有两种使用方式，一种是直接在标签上面添加相应的属性，另一种是通过js进行操作。
静态方式创建如下：
<div
id="pagination"
class="easyui-pagination"
data-options="total:2000,pageSize:10"
style="background:#efefef;border:1px solid #ccc;"
>
</div>动态方式：
<div id="pp" style="background:#efefef;border:1px solid #ccc;"></div>
<script>
$("#pp").pagination({
"total":100, //表示总记录数
"pageSize":10, //每页显示多少条记录
"pageNumber":2, //当前页号
"pageList":[10,20], //
"buttons":[
{
iconCls:'icon-add',
handler:function(){alert('add')}
},'-',{
iconCls:'icon-save',
handler:function(){alert('save')
