jQuery插件开发,关于参数引用的疑问
我在init 初始化时 创建了一个 bgc 的参数,想在 destroy 方法中引起的话我该怎么做,找了很久也没找到相关的资料,
现在我外部调用调用的时候会提示 not defined,
调用的代码
$(function () {
$('#btn1').pluginName('init');
$('#btn2').pluginName('destroy', {
bgc: '#0099ff'
});
});
下面是插件代码:
(function($) {
var privateFunction = function() {
// 执行代码
}
var methods = {
init: function(options) {
// 在每个元素上执行方法
return this.each(function() {
var $this = $(this);
// 尝试去获取settings,如果不存在,则返回“undefined”
var settings = $this.data('pluginName');
// 如果获取settings失败,则根据options和default创建它
if(typeof(settings) == 'undefined') {
var defaults = {
bgc: 'red'
}
settings = $.extend({}, defaults, options);
// 保存我们新创建的settings
$this.data('pluginName', settings);
} else {
// 如果我们获取了settings,则将它和options进行合并(这不是必须的,你可以选择不这样做)
settings = $.extend({}, settings, options);
// 如果你想每次都保存options,可以添加下面代码:
// $this.data('pluginName', settings);
}
// 执行代码
$this.on('click', function() {
$('div').css({
background: settings.bgc
});
});
});
},
destroy: function(options) {
// 在每个元素中执行代码
return $(this).each(function() {
var $this = $(this);
// 执行代码
$this.on('click', function() {
$('div').css({
background: settings.bgc
});
});
// 删除元素对应的数据
$this.removeData('pluginName');
});
},
val: function(options) {
// 这里的代码通过.eq(0)来获取选择器中的第一个元素的,我们或获取它的HTML内容作为我们的返回值
var someValue = this.eq(0).html();
// 返回值
return someValue;
}
};
$.fn.pluginName = function() {
var method = arguments[0];
if(methods[method]) {
method = methods[method];
arguments = Array.prototype.slice.call(arguments, 1);
} else if( typeof(method) == 'object' || !method ) {
method = methods.init;
} else {
$.error( 'Method ' + method + ' does not exist on jQuery.pluginName' );
return this;
}
return method.apply(this, arguments);
}
})(jQuery);
如果插件中不用data方法,是可以引用的,但在调用的时候如果同一个页面里有传入新的参数,那么两个btn实现的效果都一样了
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论