jQuery плагин объект теряет переменную?

Question

jQuery плагин объект теряет переменную?

0

Я разрабатываю простой плагин с 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, над которым он работает. Для этого я просто добавлю дополнительную переменную "pluginData" в объект jQuery. Проблема в том, что она недоступна позже. Как с этим бороться? Какой лучший подход для этого?

kboom 09 март 2014, в 23:37

Источник

0

var pluginData = this.pluginData; ? this.pluginData также будет неопределенным
Popnoodles 09 март 2014, в 22:27

Теги:

javascript

jquery

plugins

1 ответ

Ещё вопросы

var pluginData = this.pluginData; ? this.pluginData также будет неопределенным

Popnoodles · Accepted Answer · 2014-03-09T20-27-00.000Z

Передайте объект при запуске плагина. $('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/

Спасибо за ваш подробный ответ. Оно работает.