Question

我正在使用jQuery开发一个简单的插件。我认为我需要这样做：

(function($) {

   var somePrivateFn = function() {
       alert(this.x);
   }

   $.fn.myPlugin = function() {

       if(typeof arguments[0] === "string") {
            var fnargs = Array.prototype.slice(arguments, 1);
            // pluginData will be undefined
            var pluginData = this.pluginData;
            somePrivateFn.apply(pluginData, fnargs);
       }

       return this.each(function() {
           var data = this.pluginData = {};
           data.x = 1;
       };
   }
})(jQuery);

当然我的插件需要为它正在处理的jquery对象存储一些变量。为此，我只在jQuery对象本身放置一个额外的变量“pluginData”。问题是以后无法访问。怎么处理呢？这样做的最佳方法是什么？

Answer 1

运行插件时传递对象。 $('div').myPlugin(a_data_object)它会持续到this.each循环中。

此var options=$.extend({}, pluginData);将使一次迭代中的数据不会传递到下一次。

如果您想操作，那么将该数据存储在您将使用$.data()的元素上。

(function($) {
   console.clear();
   var somePrivateFn = function(data) {
       console.log(data.x);
   }

   $.fn.myPlugin = function(pluginData) {
       // send to another func
       somePrivateFn(pluginData);
       // use on each div
       return this.each(function(i) {
           var options=$.extend({}, pluginData);
           // add some example data
           options.y = "i am y";
           options.iteration=i;
           options.text=$(this).text();
           // store it on the element   
           $(this).data('pluginData', options);
       });      
   }

   // run the plugin on div elements
   $('div').myPlugin({x:"i am x"});

   // check out the data later
   $('div').each(function(){
        console.log($(this).data('pluginData'));
   });

})(jQuery);

示例：http://jsfiddle.net/xXt5W/1/
$ .data（）docs：https://api.jquery.com/jQuery.data/

jQuery插件对象丢失变量？

1 个答案: