如何扩展jquery插件
最近老大叫我写一个移动表格格子的插件，用于线路的设计，本来是写一个jquery插件的，后来又要我用easyui里的datagrid扩展，即移动datagrid里的表格，当然期间我也学了jquery插件的写法，方法如下：
1、格式
(function($){
//这里写内容
})(jQuery);
2、定义默认方法
(function($){
var methods = {
init : function(){},
afterDeleteBox : function(){
alert(3);
},
update:function(param){
}
};
})(jQuery);
3、定义插件名字
(function($){
var methods = {
init : function(){},
afterDeleteBox : function(){
alert(3);
},
update:function(param){
}
};
$.fn.boxmove = function(options,param){//boxmove 为插件的名字
$.fn.boxmove.defaults = {//这里定义插件的默认属性
width:800,
height:500,
boxWidth:80,
boxHeight:30,
data:null,
url:null,
method:'post',
columns:[],
afterDeleteBox:null//这是一个事件,用的时候可以写成一个函数
};
})(jQuery);
4、定义参数变量，用户获取插件的属性和调用事件
var args = $.extend({}, $.fn.boxmove.defaults, options);
5、开始执行，即调用此插件要实现的功能
一般用链式
(function($){
var methods = {
init : function(){},
afterDeleteBox : function(){
alert(3);
},
update:function(param){
}
};
$.fn.boxmove = function(options,param){//boxmove 为插件的名字
$.fn.boxmove.defaults = {//这里定义插件的默认属性
width:800,
height:500,
boxWidth:80,
boxHeight:30,
data:null,
url:null,
method:'post',
columns:[],
afterDeleteBox:null//这是一个事件,用的时候可以写成一个函数
};
var args = $.extend({}, $.fn.boxmove.defaults, options);
return this.each(function(){
//这里写此插件要实现的功能
args.width;//获取widht;
args. afterDeleteBox();//执行事件
})
})(jQuery);
6、用法
$("#dd").boxmove({
data : [{"productid":"FI-SW-01","productName":"test1"},
{"productid":"K9-DL-01","productName":"test2"},
{"productid":"K9-DL-01","productName":"test2"}],
columns:[
{field:'productid'},
{field:'productName'}
],
afterDeleteBox : function(){
alert(2);
}
});
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！