### jQuery EasyUI 官方API文档中文版
version 1.5.1 Build 1
作者：王锦阳 CSDN账号：richie696
EasyUI专题 http://download.csdn.net/album/detail/343

### 文档

EasyUI 每个组件的属性，方法和事件。用户可以很容易地扩展他们。

#### 属性

所有的属性都定义在jQuery.fn.{plugin}.defaults里面。例如，对话框属性定义在jQuery.fn.dialog.defaults里面。

#### 事件

所有的事件（回调函数）也都定义在jQuery.fn.{plugin}.defaults里面。

#### 方法

调用方法的语法：$('selector').plugin('method', parameter);

解释：

- selector 是jQery对象选择器。
- plugin 是插件的名称。
- method 是相应插件现有的方法。
- parameter 是参数对象，可以是一个对象、字符串等。

所有方法都定义在jQuery.fn.{plugin}.methods。每个方法都有2个参数：jq和param。第一个参数'jq'是必须的，这是指的jQuery对象。第二个参数'param'是指传入方法的实际参数。例如，为dialog组件扩展一个方法名为'mymove'，代码如下：

1. $.extend($.fn.dialog.methods, {
2. mymove: function(jq, newposition){
3. return jq.each(function(){
4. $(this).dialog('move', newposition);
5. });
6. }
7. });

    $.extend($.fn.dialog.methods, {
        mymove: function(jq, newposition){
            return jq.each(function(){
                $(this).dialog('move', newposition);
            });
        }
    });

现在你可以调用'mymove'方法将对话框移动到指定位置：

1. $('#dd').dialog('mymove', {
2. left: 200,
3. top: 100
4. });

    $('#dd').dialog('mymove', {
        left: 200,
        top: 100
    });

### jQuery EasyUI 入门指南

下载程序库并导入EasyUI的CSS和Javascript文件到您的页面。

1. <link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css">
2. <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css">
3. <script type="text/javascript" src="easyui/jquery-1.7.2.min.js"></script>
4. <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>

一旦你导入了EasyUI必须的文件，你就可以通过标记或Javascript定义一个EasyUI组件。例如：定义一个带可折叠功能的面板，你需要写的HTML代码如下：

1. <div id="p" class="easyui-panel" style="width:500px;height:200px;padding:10px;"
2. title="My Panel" iconCls="icon-save" collapsible="true">
3. The panel content
4. </div>

当通过标记创建一个组件的时候，从EasyUI 1.3版开始可以用HTML5标准的'data-options'属性来改写上面的代码为：

1. <div id="p" class="easyui-panel" style="width:500px;height:200px;padding:10px;"
2. title="My Panel" data-options="iconCls:'icon-save',collapsible:true">
3. The panel content
4. </div>

下面的代码演示了如何创建一个组合框，并绑定 onSelect 事件。

1. <input class="easyui-combobox" name="language"
2. data-options="
3. url:'combobox_data.json',
4. valueField:'id',
5. textField:'text',
6. panelHeight:'auto',
7. onSelect:function(record){
8. alert(record.text)
9. }" />