jQuery Liste complète des événements auxquels vous pouvez vous lier

JavaScript combiné avec jQuery peut capturer de nombreux événements de souris, des événements de clavier, des événements de navigateur et des événements d'élément DOM, et utiliser bind(), live() et d'autres méthodes pour effectuer des opérations déclenchées par des événements. La liste suivante des principaux événements que vous devez connaître: blur, focus, focusin, focusout, load, resize, scroll, unload, click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, mouseenter, mouseleave, change, >, select, submit, keydown, keypress, keyup, error,

,

,

Événement de souris scroll click dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, mouseenter, mouseleave, load, resize, scroll unload, error

>

Exemple:

(function($) {
    $(document).ready(function() {
        $('#id').bind('click', function(e) {
            // 鼠标事件触发（元素被点击）
        });
    });
})(jQuery);

Événements de clavier

keydown, keypress, keyup,

Exemple:

(function($) {
    $(document).ready(function() {
        $(document).bind('keypress', function(e) {
            // 键盘事件触发
        });
    });
})(jQuery);

Événements de navigateur

load resize, scroll, unload, error,

,

(function($) {
    $(document).ready(function() {
        // 浏览器事件触发（文档对象模型加载完成）
    });
})(jQuery);

Exemple:

événement d'élément DOM blur focus focusin, focusout, change, select, submit,

,

,

(function($) {
    $(document).ready(function() {
        $('#id').bind('blur', function(e) {
            // DOM事件触发（输入焦点离开）
        });
    });
})(jQuery);

Exemple:

démo

Veuillez vous référer à: Recherchez le code clé de la clé du clavier

.bind() jQuery Event List List FAQs (FAQS) .on() Quelle est la différence entre

et

dans .bind()? .on() Les méthodes .bind() et .on() dans .on() jQuery sont toutes deux utilisées pour attacher des événements aux éléments. Cependant, il existe des différences clés entre les deux. La méthode

est une méthode d'événements supplémentaires fournis à l'origine par jQuery. Il ne fonctionne pas avec des éléments qui sont ajoutés dynamiquement après le chargement de la page. D'un autre côté, la méthode introduite dans jQuery 1.7 convient à la fois pour les éléments et les éléments existants qui sont ajoutés dynamiquement plus tard. Maintenant, il est recommandé d'utiliser dans le nouveau code car il a de meilleures performances et plus de fonctionnalités.

Comment introduire des événements à jQuery?

Pour introduire des événements en jQuery, vous pouvez utiliser la méthode .unbind(). Cette méthode supprime le gestionnaire d'événements connecté à l'aide de la méthode .bind(). Vous pouvez supprimer tous les gestionnaires d'événements pour un élément, ou simplement supprimer des gestionnaires d'événements spécifiques en spécifiant le type d'événement en tant que paramètre. Par exemple, $("#element").unbind("click") supprimera tous les gestionnaires d'événements de clics pour les éléments avec id 'élément'.

Puis-je lier plusieurs événements au même élément dans jQuery?

Oui, vous pouvez lier plusieurs événements au même élément dans jQuery. Vous pouvez le faire en passant un objet à la méthode .on(), où la clé est le nom de l'événement et la valeur est le gestionnaire d'événements. Par exemple, $("#element").on({click: function(){}, mouseover: function(){}}) lie les événements Click et MouseOver aux éléments avec ID "Element".

Comment arrêter la propagation des événements dans jQuery?

Pour arrêter la propagation des événements dans jQuery, vous pouvez utiliser la méthode .stopPropagation(). Cette méthode empêche les événements de bouillonner dans l'arbre Dom, empêchant tout gestionnaire parent de recevoir des notifications d'événements. Vous pouvez appeler cette méthode dans le gestionnaire d'événements comme suit: function(event){ event.stopPropagation(); }.

Qu'est-ce que le délégué des événements dans jQuery et comment puis-je l'utiliser?

La délégation d'événements dans jQuery est une technique où vous déléguez le traitement d'événements à un élément parent au lieu de lier des événements à un élément spécifique. Ceci est particulièrement utile lorsque vous avez beaucoup d'éléments ou ajoutez des éléments dynamiquement. Vous pouvez utiliser le délégué de l'événement en spécifiant le sélecteur comme deuxième paramètre à l'aide de la méthode .on(). Par exemple, $("#parent").on("click", ".child", function(){}) délégue l'événement de clic de tous les éléments enfants à l'élément parent.

Comment déclencher un événement par programme dans jQuery?

Pour déclencher un événement programmatiquement dans jQuery, vous pouvez utiliser la méthode .trigger(). Cette méthode déclenche le comportement par défaut des événements et événements spécifiés sur l'élément sélectionné (tel que la soumission de formulaire). Par exemple, $("#element").trigger("click") déclenchera par programme un événement de clic sur un élément avec «élément» ID.

Puis-je transmettre des données au gestionnaire d'événements dans jQuery?

Oui, vous pouvez transmettre des données aux gestionnaires d'événements dans jQuery. Vous pouvez le faire en faisant passer l'objet en deuxième paramètre à la méthode .on(). Les propriétés de cet objet seront disponibles en tant que propriétés dans l'objet d'événement dans le gestionnaire d'événements. Par exemple, $("#element").on("click", {name: "John"}, function(event){ alert(event.data.name); }) affiche "John" lorsque l'élément est cliqué.

Quelle est la différence entre

et .live() dans .on()?

Les méthodes

et .live() dans .on() jQuery sont toutes deux utilisées pour attacher des événements aux éléments. Cependant, il existe certaines limitations et caractéristiques de la méthode dégroupée .live() dans jQuery 1.7. Il ne fonctionne pas avec certains événements (comme "soumettre" et "focus") et il attache le gestionnaire d'événements à la racine du document, ce qui peut entraîner des problèmes de performance. D'un autre côté, la méthode .on() surmonte ces limitations et est maintenant la méthode recommandée.

Comment bloquer l'action par défaut des événements dans jQuery?

Pour bloquer l'action par défaut des événements dans jQuery, vous pouvez utiliser la méthode .preventDefault(). Si l'événement est annulée, cette méthode annule l'événement, ce qui signifie que l'action par défaut appartenant à l'événement ne se produira pas. Vous pouvez appeler cette méthode dans le gestionnaire d'événements comme suit: function(event){ event.preventDefault(); }.

Puis-je lier les événements aux éléments qu'une seule fois dans jQuery?

Oui, vous ne pouvez lier les événements aux éléments qu'une seule fois dans jQuery. Vous pouvez utiliser la méthode .one() pour y parvenir. Cette méthode fonctionne de la même manière que la méthode .on(), mais une fois le gestionnaire d'événements tiré une fois, le gestionnaire d'événements sera supprimé. Par exemple, $("#element").one("click", function(){}) déclenchera le gestionnaire d'événements de clic qu'une seule fois pour les éléments avec ID "Element".

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!