Question

我使用自己的插件在使用jquery-ui对话框时设置了一些东西。而不是打电话：

$("#popup").dialog(options);

我用这个：

$("#popup").dialogPlugin(options);

dialogPlugin会调用.dialog(options)（做完一些事后）。

在我的插件中，我可以修改对话框事件的一些函数，如下所示：

var originalCloseFn = options.close;
options.close = function() {
    //my own stuff.
    originalCloseFn();
};

该插件运行良好，但经过一段时间使用它后，我意识到我无法从插件外部更改对话框功能，如下所示：

$("#popup").dialog("option", "close", newFunctionOnClose);

如果我这样做，插件添加到close函数的代码将会丢失。

所以我在插件的开头添加了这段代码：

if (options == "option") {
    if (val == undefined)
        return _this.dialog("option", name);
    else
        return _this.dialog("option", name, val);
}

现在我需要更改此代码的第五行以实际更改我的插件的选项，而不是jquery-ui。（.dialogPlugin函数的选项，而不是.dialog的选项。我真的不知道我该怎么做。有什么想法吗？

修改

我知道这个问题不是很明确，而且我的英语不好让我不再解释自己，所以我做了一个小事example。

我想要的是在第七行（return $(this).dialog("option", name, val);）而不是修改（相当于optionsForJQuery.close）修改options.close。这样我就可以避免陷入插件行为。

Answer 1

试试这个：

HTML：

<div id="popup">I'm a popup</div>

JS：

(function ($) {
    $.fn.dialogPlugin = function (options, name, val) {

        var
            // setter function close
            fnClose = null,

            // function when close
            fnMyClose = function() {
                alert("This is plugin's close behavior");
                if (fnClose)
                    fnClose();
            };

        if (options == "option") {
            if (name == "close" && $.isFunction(val)) {
                fnClose = val;
                val = fnMyClose;
            }
        } 
        else {
            if (options.close)
                fnClose = options.close;

            options.close = fnMyClose;
        }

        return (name)
            ? $(this).dialog(options, name, val) //if var == 'undefined'is equal to not send parameters
            : $(this).dialog(options);
    };

})(jQuery);


$("#popup").dialogPlugin({
    close: function() {
        alert("This is user's first close behavior");
    }
});


$("#popup").dialogPlugin("option", "close", function() {
    alert("This is user's second close behavior");
});

修改

或更简单优雅：

(function($){ var dialog_close = $.ui.dialog.prototype.close; $.ui.dialog.prototype.close = function() { var self = this; alert("This is plugin's close behavior"); dialog_close.apply(this, arguments); }; })(jQuery);

jQuery：调用后更改插件选项

1 个答案: