jQuery EasyUI插件

来源:互联网 发布:java语法分析器 编辑:程序博客网 时间:2024/06/06 05:40

前言:

在做项目的时候对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 是参数对象,可以是对象、字符串...

0 0