Créer un plugin, exposer des événements

Question

Comment exposer des événements aux utilisateurs de mon plugin?

---

Je sais que je devrais utiliser:

$('#myPluginDiv').trigger('eventName', ["foo", "bar"]); 

pour déclencher l'événement, mais je suis à la recherche des meilleures pratiques décrivant comment déclarer et appeler des événements dans les plugins.

Answer 1

Je pense que vous pouvez consulter quelques-uns des plugins les plus utilisés et faire vos propres hypothèses. Nous n'avons pas de normes à ce sujet, juste une convention de code. Colorbox (source: https://github.com/jackmoore/colorbox/blob/master/jquery.colorbox.js) définit un préfixe et certaines constantes pour les noms d'événements. Il a également une fonction pour déclencher et exécuter les rappels.

jQuery UI (source: https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.widget.js) ont également une fonction commune sur la classe widget pour le déclenchement d'événements (utilisation: https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.dialog.js), mais vous pouvez voir que les événements sont codés en dur au milieu de la source, au lieu des constantes sur le haut comme sur Colorbox.

Personnellement, je pense, et je le fais dans mes propres plugins, que la création de constantes est beaucoup mieux si vous avez beaucoup d'événements à déclencher, mais ce n'est pas nécessaire si vous ne déclenchez que 2 ou 3 événements.

Une fonction d'assistance est un must et devrait faire partie de votre modèle.

Les noms d'événements que j'utilise et que je vois sont tous conformes à la norme CamelCase par ex. beforeClose.

Certains préconisent l'utilisation d'un préfixe pour des événements comme le cbox_open ou même click.myPlugin de Colorbox (voir: http://api.jquery.com/on/#event-names)

Conclusion: essayer de suivre les meilleures pratiques et conventions pour la programmation en général et de regarder les meilleurs exemples là-bas .

Answer 2

dans le plugin créer litereal d'objet comme

var plugin = { 
    show:function(){ 
// code for show() 
} 


};