EasyUI又升级了，此次升级的资源或是蛮多的，新特点也是有，Bug修补也是有，整体而言愈来愈健全了！

文本文档

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，编码如下所示：

$.extend($.fn.dialog.methods,{

mymove:function(jq,newposition){

returnjq.each(function(){

$(this).dialog(move,newposition);

});

}

});

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

如今你能启用mymove方法将提示框挪动到指定位置：

$(#dd).dialog(mymove,{

left:200,

top:100

});

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

jQuery EasyUI 新手入门手册

免费下载程序库并导进EasyUI的CSS和Javascript文档到您的网页页面。

lt;linkrel=stylesheettype=text/csshref=easyui/themes/default/easyui.cssgt;

lt;linkrel=stylesheettype=text/csshref=easyui/themes/icon.cssgt;

lt;scripttype=text/javascriptsrc=easyui/jquery-1.7.2.min.jsgt;lt;/scriptgt;

lt;scripttype=text/javascriptsrc=easyui/jquery.easyui.min.jsgt;lt;/scriptgt;

lt;link rel=stylesheet type=text/css href=easyui/themes/default/easyui.cssgt; lt;link rel=stylesheet type=text/css href=easyui/themes/icon.cssgt; lt;script type=text/javascript src=easyui/jquery-1.7.2.min.jsgt;lt;/scriptgt; lt;script type=text/javascript src=easyui/jquery.easyui.min.jsgt;lt;/scriptgt;

一旦你导进了EasyUI务必的文档，你也就可以根据标识或Javascript定义一个EasyUI组件。比如：定义一个带折叠式作用的控制面板，你需要写的HTML编码如下所示：

lt;divid=pclass=easyui-panelstyle=width:500px;height:200px;padding:10px;

title=MyPaneliconCls=icon-savecollapsible=truegt;

Thepanelcontent

lt;/divgt;

lt;div id=p style=width:500px;height:200px;padding:10px; title=My Panel iconCls=icon-save collapsible=truegt; The panel content lt;/divgt;

当根据标识建立一个组件的情况下从1.3版逐渐data-options属性可以用于适用HTML5兼容属性名字。因此你能改变上边的编码为：

lt;divid=pclass=easyui-panelstyle=width:500px;height:200px;padding:10px;

title=MyPaneldata-options=iconCls:icon-save,collapsible:truegt;

Thepanelcontent

lt;/divgt;

lt;div id=p style=width:500px;height:200px;padding:10px; title=My Panel data-options=iconCls:icon-save,collapsible:truegt; The panel content lt;/divgt;

下边的编码演试了怎样建立一个组成框，并关联onSelect事情。

lt;inputclass=easyui-comboboxname=language

data-options=

url:combobox_data.json,

valueField:id,

textField:text,

panelHeight:auto,

onSelect:function(record){

alert(record.text)

}/gt;