Détecter si le plugin jQuery est appliqué à plusieurs éléments?

Question

Je travaille sur un plugin jQuery qui peut être appliqué à plusieurs éléments. Le plugin inclut des effets d'animation et j'ai besoin de gérer la file d'attente d'événements en fonction de si le plugin est utilisé sur plusieurs éléments (au lieu d'un).

Quelle est la meilleure façon de détecter si le plugin a été appliqué à un seul élément ou à plusieurs éléments?

Modifier ...

Le correctement si le plugin fonctionne bien length est passé plusieurs éléments (tels que $('.myClass').plugin()) mais si le plug-in est appelé sur de multiples éléments simples (tels que $('#myElem1').plugin() et $('#myElem2').plugin()), puis la longueur renvoie un pour chaque appel.

Est-ce il y a un moyen de détecter plusieurs instances lorsque le plug-in est utilisé comme dans le second exemple/

Answer 1

this à l'intérieur du plug-in, en fonction de votre style, fait référence à l'objet jQuery, vous pouvez simplement vérifier the .length property , par exemple:

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

pour modifier: suivi le total peut être une meilleure option, par exemple:

(function($) { 
    $.pluginCount = 0; 
    $.fn.plugin = function(options) { 
    $.pluginCount += this.length; //add to total 
    if($.pluginCount > 1) //overall being applied to multiple elements 
    }; 
})(jQuery) 

Answer 2

En supposant que vous appliquez votre plugin par $ ('un sélecteur'). MyPlugin(), le mot-clé "this" fera référence à l'objet jquery que vous avez appelé le plugin dans votre fonction plugin.

Donc, pour résumer:

 
(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(); 

Answer 3

Si vous voulez un moyen générique pour tester si oui ou non un plug-in a été appliqué à un ensemble arbitraire d'éléments, voici une approche:

// 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; 
}; 

avec ce balisage:

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

Voici un test:

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

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

Démo: http://jsfiddle.net/B5QVC/