jQuery插件,从其他方法调用函数 [英] Jquery Plugins, calling functions from other methods
问题描述
就像这里的许多其他类似问题一样,我正在编写我的第一个jQuery插件. 它旨在采用一个select元素,并用可单击的list元素替换这些选项,以用作样本. 我的主要功能运行良好,但是我需要添加调用另一个方法的功能,这将禁用某些选项. 我的问题是,这样做时,我需要绑定一些点击元素,然后取消绑定其他元素.
Like so many other similar questions on here, I am writing my first jQuery plugin. It's intended to take a select element and replace the options with clickable list elements, to be used as swatches. I've got the main functionality working great, but I need to add the ability to call another method, which will disable certain options. My problem is that when doing this, I need to bind some click elements and unbind others.
当前,我的原始绑定包含在我的'init'方法内的函数中.我需要能够从另一个禁用"方法调用该函数. 所以这是一些代码:
Currently my original binding is contained in a function inside my 'init' method. I need to be able to call that function from another 'disable' method. So here's some code:
(function($){
var methods = {
// Init method
init : function(options) {
// Set options
var
defaults = {
clickCallback: function(){} // Define empty function for click callback
}
, settings = $.extend({}, defaults, options)
// Function to bind options
function fnBindOptions(var1, var2, var3) {
// Stuff to bind elements
// Hit the click callback
settings.clickCallback.call(this);
}
return this.each(function() {
// Check that we're dealing with a select element
if(element.is('select')) {
// Loop through the select options and create list items for them
$('option', element).each(function() {
// Stuff to create list elements
// Bind click handler to the new list elements
fnBindOptions(var1, va2, var3);
});
}
});
// return
return this();
}
// Disable buttons method
, disable : function(options) {
// I need to access fnBindOptions from here
$(elementID).children('li').removeClass('disabled').each(function(){
fnBindOptions(var1, var2, var3);
});
}
};
这是我的问题:在禁用每个选项之前,我需要在每个选项上调用bind函数-但是我无法从disable方法中访问fnBindOptions-并且因为fnBindOptions包含来自"settings"变量的回调,因此我可以也可以将其移出"init"方法之外.
Here's my problem: I need to call the bind function on each option before disabling it - but I can't access fnBindOptions from within the disable method - and because fnBindOptions includes a callback from the 'settings' variable, I can't move it outside of the 'init' method either.
那么,有人在这里有什么建议吗?
So, does anyone have any advice here?
谢谢!
推荐答案
一种解决方法是将defaults
,settings
和bindOptions
函数放在methods
对象(或范围更广),并据此进行引用:
One way to solve this is to put your defaults
, settings
and bindOptions
function in the methods
object (or another object in the broader scope) and reference them accordingly:
var methods = {
defaults: {
clickCallback: function() {}
},
settings: {},
bindOptions: function(var1, var2, var3) {
// Stuff to bind elements
// Hit the click callback
methods.settings.clickCallback.call(this);
},
// Init method
init: function(options) {
methods.settings = $.extend({}, methods.defaults, options);
return this.each(function() {
if (element.is('select')) {
$('option', element).each(function() {
// Stuff to create list elements
// Bind click handler to the new list elements
methods.bindOptions(var1, va2, var3);
});
}
});
},
// Disable buttons method
disable: function(options) {
$(elementID).children('li')
.removeClass('disabled')
.each(function() {
methods.bindOptions(var1, var2, var3);
});
}
};
这篇关于jQuery插件,从其他方法调用函数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!