Javascript 公开附加到页面上多个元素的jQuery插件的属性

有人向我建议，以下结构是从jQuery插件公开公共属性的首选/标准结构

(function($) {
   $.myPlugin = {
       data: {}
   };

    $.fn.myPlugin = function() {
        return this;
    };
})(jQuery);

上面的示例通过语法

$.myPlugin.data.

如果插件附加到页面上的多个HTML元素，那么我认为$.myPlugin.data将无效，因为它相当于一个静态变量

编写插件的另一种方法是什么？数据与特定插件的实例相关

如何通过插件外部的代码引用此属性？你是怎么看房子的

---

使用回调函数怎么样

// external code
$('.something').myPlugin({
    onLoad : function(object, data) {
        // use data here
    }
});

---

这将把数据附加到插件操作的每个元素上

(function($) {
    $.fn.extend({
        myPlugin: function (options) {
            var defaultConfig = {data: {}};
            return this.each(function () {
                $(this).data(
                   "myPlugin", $.extend(defaultConfig, options)
                );
            });
        }
    });
})(jQuery);

例如，当这样调用时：

$("div.foo").myPlugin({option: "value"});

每个

都有自己的

{
   data: {},
   option: "value"
}

---

可以在

$（this.data（“myPlugin”）

上找到，您可以了解大多数jQuery UI小部件是如何实现的。他们通常接受三个参数，例如

.myPlugin（'option'，key[，value]））

来获取或设置选项。