Плагин jQuery - обновить настройки после инициализации

В настоящее время единственным поддерживаемым шаблоном вызова в этом плагине является отправка литерала объекта, содержащего настройки для перезаписи значений по умолчанию. Например.:

$('.element').pwstabs({
  effect: 'scalein',
  defaultTab: 2
});

Этот шаблон вызова определяется в следующем методе:

$.fn[pluginName] = function ( options ) {
    return this.each(function () {
        new Plugin( this, options );
    });
};

Как видите, словарь опций отправляется в качестве единственного параметра в функцию-конструктор Plugin() для сборки и инициализации подключаемого модуля.

Для поддержки нужного шаблона вызова вам придется изменить этот метод, чтобы он поддерживал оба шаблона вызова (инициализация с литералом объекта, а также вызов любого метода с большим количеством параметров, например, метода настройки параметров).

Вот улучшенная функция, которая будет обрабатывать оба шаблона вызова. Кроме того, он также будет хранить экземпляр плагина в элементе, поэтому вы можете получить доступ к существующим настройкам и т. Д. При последующих вызовах (например, изменениях настроек) для того же элемента.

$.fn[pluginName] = function (options) {

    // get the arguments 
    var args = $.makeArray(arguments),
        after = args.slice(1);

    return this.each(function () {

        // check if there is an existing instance related to element
        var instance = $.data(this, pluginName);

        if (instance) {
            if (instance[options]) {
                instance[options].apply(instance, after);
            } else {
                $.error('Method ' + options + ' does not exist on Plugin');
            }
        } else {
            // create the plugin
            var plugin = new Plugin(this, options);

            // Store the plugin instance on the element
            $.data(this, pluginName, plugin);
            return plugin;
        }
    });
}

Это позволит вам вызывать плагин по запросу:

$('.element').pwstabs('options','effect','slidedown');

Однако это означает, что у вас есть метод «options» в прототипе плагина, поэтому обязательно добавьте его:

Plugin.prototype = {

    options: function (option, val) {
        this.settings[option] = val;
    },

    // Constructing Tabs Plugin
    init: function () {
        // omitted code for brevity
    }
}

Как вы видите, настройки параметров просто устанавливают новый параметр для существующего экземпляра. Очень просто и эффективно. Новая настройка будет подхвачена обработчиком метода click и вуаля!

Вот jsFiddle с примером кода на случай, если у вас возникнут проблемы с реализацией того, что я описывал до сих пор:

http://jsfiddle.net/7whs3u1n/6/

Обновление: я значительно улучшил свой ответ, чтобы избавиться от ненужных вещей, включить больше деталей и полную реализацию, которая работает (проверьте скрипку выше);) Я надеюсь, что это ответит на ваш вопрос!

Добавление состояния к вашему подключаемому модулю было несложным, но когда у вас есть свободное время, также проверьте альтернативный механизм для написания сохраняющих состояние подключаемых модулей jQuery, который называется фабрика виджетов jQuery:

http://learn.jquery.com/plugins/stateful-plugins-with-widget-factory/

В будущем вы можете переписать свой плагин, чтобы использовать фабрику виджетов. Это, безусловно, упростит ваш код;)

Попробуйте этот шаблон

(function ($) {
    var defaults = {
        "text": "abcdefg",
    }
    , options = $.extend({}, defaults, options);
    $.fn.plugin = function (options) {
        var options = (function (opts, def) {
            var _opts = {};
            if (typeof opts[0] !== "object") {
                _opts[opts[0]] = opts[1];
            };
            return opts.length === 0 
                   ? def 
                   : typeof opts[0] === "object" 
                     ? opts[0] : _opts
        }([].slice.call(arguments), defaults));
        return $(this).text(options.text)
    }
}(jQuery));

$(".results:eq(0)").plugin(); // return `defaults`
$(".results:eq(1)").plugin({"text":"gfedcba"}); // return `options`
$(".results:eq(2)").plugin("text", 123); // return `arguments` as `options`

    (function ($) {
        var defaults = {
            "text": "abcdefg",
        }
        , options = $.extend({}, defaults, options);
        $.fn.plugin = function (options) {
            var options = (function (opts, def) {
                var _opts = {};
                if (typeof opts[0] !== "object") {
                    _opts[opts[0]] = opts[1];
                };
                return opts.length === 0 
                       ? def 
                       : typeof opts[0] === "object" 
                         ? opts[0] : _opts
            }([].slice.call(arguments), defaults));
            return $(this).text(options.text)
        }
    }(jQuery));
    
    $(".results:eq(0)").plugin(); // return `defaults`
    $(".results:eq(1)").plugin({"text":"gfedcba"}); // return `options`
    $(".results:eq(2)").plugin("text", 123); // return `arguments` as `options`

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="results"></div><br />
<div class="results"></div><br />
<div class="results"></div>