javascript - jQuery 扩展数据持久化

Question

我想知道如何在 jQuery 扩展中的方法之间共享数据，因此当我调用 refresh 方法时，它能够使用 plugin 和 options 在 init 中定义的变量。

每页有多个这样的控件。

这是我所拥有的示例:

(function($) {
    var methods = {
        init: function(options) {
            var defaults = {
                defaultText: "Rating",
                maxRating: 5,
            };

            options = $.extend(defaults, options);

            return this.each(function() {
                var plugin = $(this);

                main($(plugin), options);
            });
        },

        refresh: function() {
            // I would like to be able to use the 'options' and 'plugin' variables defined in the init method
        }
    };

    function main(plugin, option) {
        // do main code stuff
    }
}(jQuery));

Answer 1

将数据存储在元素本身上，然后按元素访问它。

(function ($) {

var methods = { // should probably expose this object in some way so it can be extended by other develoeprs or so that defaults can be changed

    defaults : {
        defaultText: "Rating",
        maxRating: 5,
    },

    init : function (options) {

        options = $.extend({}, methods.defaults, options);

        this.data("myPlugin", options);

        return this.each(function () {

            main($(this), options);

        });
    },

    refresh : function () {

        return this.each(function(){

            var options = $(this).data("myPlugin");

        });
                // I would like to be able to use the 'options' and 'plugin' variables defined in the init method
    }
};

function main(plugin, option) {

    // do main code stuff

}

})(jQuery);

我不确定您为什么想要访问插件变量，您应该已经有权访问调用刷新方法的元素。