jQuery插件对象丢失变量

jQuery plugin object looses variable?

本文关键字：变量 对象 插件 jQuery      更新时间：2023-09-26

我正在用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"。问题是以后无法访问它。如何处理?最好的方法是什么?

运行插件时传递该对象。$('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()文档:https://api.jquery.com/jQuery.data/

相关文章：