jQuery plugin .fn question

Question

Je semble avoir des problèmes pour créer un plugin jquery. Je suis en train de tester un simple plugin dans la console firebug et la fonction n'est pas définie comme je m'y attendais. Voici le modèle de code que j'utilise

jQuery.fn.test = function() {console.log("runs")} 

J'essaie d'appeler la fonction avec cet appel qui ne fonctionne pas.

$.test() 

Mais cet appel ne

$.fn.test() 

Je ne pense pas que ce soit la façon dont il est censé fonctionner donc je pense que je fais quelque chose de mal, bien que toute la documentation semble convenir que je devrais être correct. Quelqu'un a un conseil?

Merci, Cory

Answer 1

Essayez $('div').test()!

Donnez http://docs.jquery.com/Plugins/Authoring une lecture pour une bonne introduction à jQuery plugins.

---

Ok, voici quelques informations supplémentaires pendant que je suis ici. Lors de la création d'un plugin y trois près de règles absolues:

• Toujours utiliser une méthode anonyme lorsque vous définissez votre plugin pour que vous vous assurer d'obtenir l'objet jQuery avec $.
• Essayez toujours de renvoyer l'objet jQuery (pour le chaînage).
• Toujours itérer sur les éléments car votre sélecteur correspond probablement à plus d'un élément.

Donc, pour l'amour de convention, commencez comme ceci:

(function($) { 
    $.fn.test = function() { 
    return this.each(function() { 
     console.log("runs"); 
    }); 
    } 
})(jQuery); 

Ce imprimera « runs » pour chaque élément apparié par votre sélecteur (beaucoup si vous utilisez seulement div). Essayez de mettre $(this).css('background-color', 'red'); et voir ce qui se passe. Un autre bon endroit pour regarder serait différents sites de codage sociaux (GitHub, BitBucket, Google Code, etc.) et de rechercher "jQuery Plugin" pour voir comment les autres le font.

Answer 2

Il existe deux manières d'étendre jQuery. Celui que vous avez choisi permet des choses comme:

$("div").test(); 

bien que le code est sous la forme correcte pour cela. Pour ajouter simplement une méthode statique de sorte que vous pouvez appeler:

$.test(); 

faire ceci:

jQuery.test = function() { 
    ... 
}; 

Voir Plugins/Authoring.