jQuery：调用后更改插件选项 [英] jQuery: Change plugin option after called

问题描述

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

I've a plugin made by my own to set up a few things when using dialog of jquery-ui. Instead of calling:

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

我用这个：

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

而dialogPlugin将调用 .dialog（期权）（在做了一些事情之后）。

And dialogPlugin will call .dialog(options) (after doing some stuff).

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

In my plugin I may modify some functions for the events of the dialog like this:

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

该插件效果很好，但经过一段时间使用后，我意识到我无法更改对话框插件外部的函数如下：

The plugin works great, but after some time using it I realized that I couldn't change the dialog functions from outside the plugin like this:

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

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

If I do that the code the plugin added to the close function would be lost.

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

So I added this code at the beggining of my plugin:

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

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

Now I need to change the fifth line of this code to actually change the option of my plugin, not of the jquery-ui. (The option of .dialogPlugin function, not of .dialog). I realy don't know how can I do that. Any ideas please?

编辑

我知道问题不是很很清楚，我的英语不好让我不再解释自己，所以我做了一个小小的示例。

I know that the question is not very clear and my poor english doesn't let me to explain myself any more so I've made a litle example.

我想要的是在第七行（返回$（this）.dialog（option，name，val ）; ）而不是修改（相当于 optionsForJQuery.close ）修改 options.close 。这样我就会避免破坏插件的行为。

What I want is that in the seventh line (return $(this).dialog("option", name, val);) instead of modifing that (equivalent to optionsForJQuery.close) modify options.close. That way I will avoid loding the plugins behavior.

推荐答案

试试这个：

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：调用后更改插件选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！