Jquery插件，从其他方法调用函数

Jquery Plugins, calling functions from other methods

本文关键字：方法 调用 函数 其他 插件 Jquery      更新时间：2023-09-26

像这里的许多其他类似问题一样，我正在编写我的第一个jQuery插件。它的目的是获取一个select元素，并用可点击的列表元素替换选项，用作样本。我已经让主要功能工作得很好，但我需要添加调用另一个方法的能力，这将禁用某些选项。我的问题是，当这样做的时候，我需要绑定一些点击元素和取消绑定其他。

目前我的原始绑定包含在我的'init'方法中的一个函数中。我需要能够从另一个'禁用'方法调用该函数。下面是一些代码:

(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'方法。

那么，有人有什么建议吗?

谢谢!

解决这个问题的一种方法是将defaults, settings和bindOptions函数放在methods对象(或更广泛范围内的另一个对象)中并相应地引用它们:

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);
        });
    }
};
相关文章：