将参数传递给不支持Multisuggest插件的jQuery闭包

时间:2013-06-17 16:35:03

标签: javascript jquery jquery-plugins closures autosuggest

我有一个问题,哪个人可能会发现这比我更简单,但唉,我对自定义jQuery插件没有多少经验。

我工作地点的前任开发人员给我留下了很多看似无法正常工作的剩余插件,大多数我已经能够解决这个问题但是这个问题一直困扰着我我有一段时间。

这是一个用 jQuery 编写的自定义 Multiple Suggestion插件(称为multisuggest),它有一个内部使用的函数集(* 例如setValue设置框的值,或查找以更新搜索 *

似乎他试图从外部脚本中调用这些插件函数(这个扩展脚本专门通过用户输入将新创建的建议导入到multisuggest并设置值),如下所示:

this.$input.multisuggest('setValue', data.address.id, address);

这似乎是应该调用函数,除了第二个和第三个参数似乎没有传递给函数(setValue什么也没收到),我不明白我怎么能得到它通过这些。它说我在控制台中登录时未定义。 这些功能都是这样设置的(我只包括我正在使用的功能以及来自multisuggest的内部功能,名为select的实际工作):

    MultiSuggest.prototype = $.extend(MultiSuggest, _superproto, {

    constructor : MultiSuggest, 
    select: function () { // When selecting an address from the suggestions
        var active, display, val;

        active  = this.$menu.find('.active');
        display = active.attr('data-display');
        val = active.attr('data-value');
        this.setValue(display, val, false); // This works, however when I do it as shown in the above example from an external script, it doesn't. This is because it doesn't receive the arguments.

    },
    setValue : function(display, value, newAddress) { // Setting the textbox value
        console.log(display); // This returns undefined
        console.log(value); // This returns undefined
        if (display && display !== "" &&
            value && value !== "") {
            this.$element.val(this.updater(display)).change();
            this.$hiddenInput.val(value);
            this.$element.addClass("msuggest-selected");
        }
        if(newAddress === false){
            return this.hide();
        }
    },
});

为什么它会监听函数,而不是传递给它的值?我是否需要在某处包含额外的代码行来定义这些参数?

任何有jQuery经验的人都会有很大的帮助!这是当前项目的瓶颈进展。谢谢你的时间!

修改 我错过了参数如何尝试从外部脚本传递到插件内部函数的代码。以下是关于如何处理外部调用的插件定义,任何人都可以看到这个问题吗?

$.fn.multisuggest = function(option) {
    return this.each(function() {
        var $this = $(this), data = $this.data('multisuggest'), options = typeof option === 'object' && option;
        if (!data) {
            $this.data('multisuggest', ( data = new MultiSuggest(this, options)));
        } else if (typeof(option) === 'string') {
            var method = data[option];
            var parameters = Array.prototype.slice.call(arguments, 1);

            method.apply(this, parameters);
        }
    });
};

2 个答案:

答案 0 :(得分:1)

“通常”插件主管看起来像这样:

// *****************************
// ***** Start: Supervisor *****
$.fn.multisuggest = function( method ) {
    if ( methods[method] ) {
        return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
    } else if ( typeof method === 'object' || !method ) {
        return methods.init.apply( this, arguments );
    } else {
        $.error( 'Method ' + method + ' does not exist in jQuery.' + pluginName );
    }
};
// ***** Fin: Supervisor *****
// ***************************

所有循环this都应该在方法函数内部,而不是在主管中。

我有点担心当前主管出现new MultiSuggest(...)。这种事情完全是非传统的。原作者显然有一些想法。

答案 1 :(得分:0)

你需要扩展附加到$.fn['multisuggest']的jQuery插件函数,该函数可能只接受并传递一个参数。