jQuery EasyUI插件

前言：

在做项目的时候对EasyUI有过初步的学习和简单的应用，但对它最基本的了解还差的很远，当被问起EasyUI的插件都有哪些的时候却哑口无言了，平时都在用，但却没有真正的学会。

jQueryEasyUI提供了用于创建跨浏览器网页的完整的组件集合，包括功能强大的datagrid（数据网格）、treegrid（树形表格）、panel（面板）、combo（下拉组合）等等。用户可以组合这些组件，也可以单独使用其中一个。

基础插件：

Layout（布局）：

Menu与Button：

Form（表单）：

Window（窗口）：

DataGrid（数据网格）/Tree：

实战：

方法是定义在 jQuery.fn.{plugin}.methods。每个方法有两个参数：jq 和 param。第一个参数 'jq' 是必需的，引用 jQuery 对象。第二个参数 'param' 引用方法传递的实际参数。比如，要扩展 dialog 组件的方法名为 'mymove' 的方法，代码如下：

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

现在您可以调用 'mymove' 方法来移动对话框（dialog）到指定的位置：

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

小结：

easyui的每个组件都有属性、方法和事件。用户可以很容易地对这些组件进行扩展。属性是定义在jQuery.fn.{plugin}.defaults。比如，dialog的属性是定义在jQuery.fn.dialog.defaults。事件（回调函数）也是定义在jQuery.fn.{plugin}.defaults。方法调用的语法是：$(‘selector’).plugin(‘method’,parameter);

其中selector 是 jquery 对象选择器，plugin 是插件名称，method 是与插件相匹配的已存在方法，parameter 是参数对象，可以是对象、字符串...