首先,正如Spycho所说,始终将您的插件包装在内:
标签中。
(function( $ ){
$.fn.PluginName = function() {
};
})( jQuery );
为了避免与使用美元符号的其他库发生冲突。
其次,如果您扩展
jQuery.fn
对象,使用类似
$("#myDiv")
的选择器,将其作为
this
传递给插件。这样,您就不必像您所做的那样将选择器作为参数传递给插件。
第三,您正确地做到了这一点,建议您将选项作为对象传递给插件,而不是单独的参数,这样您可以轻松地拥有和覆盖默认值:
(function( $ ){
$.fn.PluginName = function(options) {
var settings = { myOption: 1 };
if (options) {
$.extend( settings, options );
}
};
})( jQuery );
第四个问题,你创建的_privateMethod
并不真正使它成为私有方法。要实现这一点,你可以采用 jQuery 在插件编写指南中建议的模式。
(function( $ ){
var methods = {
publicMethod: function(options) {
var settings = { myOption: 1 };
if (options) {
$.extend( settings, options );
}
},
_privateMethod: function() {}
}
$.fn.PluginName = function(methodName, options) {
if (methodName == "publicMethod") {
return publicMethod.apply(this, Array.prototype.slice.call( arguments, 1 ));
}
};
})( jQuery );
这里使用了
apply
和
call
这两种高级的函数内置方法来设置函数调用的作用域。请参考
MDN文档以了解其含义。通过这种方式,您可以实际控制哪些方法是公共的,哪些是私有的。
编辑提示:如果您想完全保持jQuery的流畅接口,使您的插件既接受
$()
传递的选择,又能将其传递下去,换句话说,是可链式调用的,则您的方法需要返回它们所接收到的对象集合。
(function( $ ){
var methods = {
publicMethod: function(options) {
var settings = { myOption: 1 };
if (options) {
$.extend( settings, options );
}
return this.each(function() {
this.value = (this.value * 1) + settings.myOption;
});
},
_privateMethod: function() {}
}
$.fn.PluginName = function(methodName, options) {
if (methodName == "publicMethod") {
return methods.publicMethod.apply(this, Array.prototype.slice.call( arguments, 1 ));
}
};
})( jQuery );
请查看这个jsFiddle,以获取最终可用的示例。