Определить, применяется ли плагин jQuery к нескольким элементам? - PullRequest
3 голосов
/ 22 сентября 2010

Я работаю над плагином jQuery, который можно применять к нескольким элементам.Плагин включает в себя некоторые эффекты анимации, и мне нужно управлять очередью событий в зависимости от того, используется ли плагин для нескольких элементов (вместо одного).

Как лучше всего определить, был ли плагин применен кодин элемент или несколько элементов?

Edit ...

Свойство length работает правильно, если плагину передано несколько элементов (например, $('.myClass').plugin())но если плагин вызывается для нескольких отдельных элементов (таких как $('#myElem1').plugin() и $('#myElem2').plugin()), тогда длина возвращает единицу для каждого вызова.

Есть ли способ обнаружить несколько экземпляров, когда плагиниспользуется как во втором примере /

Ответы [ 3 ]

5 голосов
/ 22 сентября 2010

this внутри плагина, в зависимости от вашего стиля, ссылается на объект jQuery, поэтому вы можете просто проверить свойство .length , например:

 jQuery.fn.plugin = function(options) {
   if(this.length > 1) //being applied to multiple elements
 };

Для редактирования: отслеживание итогов может быть лучшим вариантом, например:

(function($) {
  $.pluginCount = 0;
  $.fn.plugin = function(options) {
    $.pluginCount += this.length;    //add to total
    if($.pluginCount > 1) //overall being applied to multiple elements
  };
})(jQuery)
1 голос
/ 22 сентября 2010

Если вы хотите использовать универсальный способ проверки, был ли плагин применен к произвольному набору элементов, вот один из подходов:

// say we want to apply this to a bunch of elements
​​$.fn.test = function(str) {
    this.each(function() {
        // set a boolean data property for each element to which the plugin is applied
        $(this).data('test', true);
        alert(str);
    });
};


// use a simple plugin to extract the count of a specified plugin
// from a set of elements
$.fn.pluginApplied = function(pluginName) {
    var count = 0;
    this.each(function() {
        if($(this).data(pluginName)) {
            count++;
        }
    });
    return count;
};

с этой разметкой:

<a href="test" class="test">Hello</a>
<br />
<a href="test" class="test">Hello</a>

Вот тест:

$("a").test('test');

alert($("*").pluginApplied('test'));​​​​​​​​​​​​​​​​ // alerts '2'

Демо: http://jsfiddle.net/B5QVC/

1 голос
/ 22 сентября 2010

Если вы примените свой плагин с помощью $ ('some selector'). MyPlugin (), ключевое слово "this" будет ссылаться на объект jquery, который вы называли плагином внутри вашей функции плагина.

Итак, подведем итог:

(function( $ ){
  $.fn.myPlugin = function() {
    if(this.size() > 1) {
       //code for multiple elements
    }
    else if(this.size() == 1) {
       //code for 1 element
    }
  }
})( jQuery );

$('div.to-pluginize').myPlugin();
...