你的位置:首页 > 软件开发 > Java > 如何自己编写一个easyui插件

如何自己编写一个easyui插件

发布时间:2015-06-26 12:00:05
本文介绍如何通过参考1.4.2版本的progressbar的源码自己编写一个HelloWorld级别的easyui插件,以及如何拓展插件的功能。有利于我们理解easyui插件的实现,以及了解如何对easyui插件进行拓展,或者当发现bug时在不修改源码的情况下对bug进行修复。 ...

本文介绍如何通过参考1.4.2版本的progressbar的源码自己编写一个HelloWorld级别的easyui插件,以及如何拓展插件的功能。

有利于我们理解easyui插件的实现,以及了解如何对easyui插件进行拓展,或者当发现bug时在不修改源码的情况下对bug进行修复。

 

1. 首先让我们来看看progressbar的源码(已经删除了一些对本文不重要的)。

比较了一下有源码的那几个插件,发现这个只有3KB,最小,所以拿这个学习最好了;而且这个progressbar没有涉及继承其他控件,易于理解。

(function($){    function init(target) {        $(target).addClass('progressbar');		return $(target);	}		$.fn.progressbar = function(options, param){		if (typeof options == 'string'){			var method = $.fn.progressbar.methods[options];			if (method){				return method(this, param);			}		}				options = options || {};		return this.each(function(){			var state = $.data(this, 'progressbar');			if (state){				$.extend(state.options, options);			} else {				state = $.data(this, 'progressbar', {					options: $.extend({}, $.fn.progressbar.defaults, $.fn.progressbar.parseOptions(this), options),					bar: init(this)				});			}		});	};		$.fn.progressbar.methods = {		options: function(jq){			return $.data(jq[0], 'progressbar').options;		},		getValue: function(jq){			return $.data(jq[0], 'progressbar').options.value;		}	};		$.fn.progressbar.parseOptions = function(target){		return $.extend({}, $.parser.parseOptions(target, ['width','height','text',{value:'number'}]));	};		$.fn.progressbar.defaults = {		width: 'auto',		height: 22,		value: 0,	// percentage value		text: '{value}%',		onChange:function(newValue,oldValue){}	};})(jQuery);

原标题:如何自己编写一个easyui插件

关键词:

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

可能感兴趣文章

我的浏览记录