Quels sont les moyens de lier des événements en javascript

Comment lier des événements : 1. Lier à l'aide de l'instruction "" ; 2. Lier à l'aide de l'instruction "dom object.on event name = event handler" Déterminer ; . Utilisez l'instruction "event source.addEventListener (nom de l'événement, gestionnaire d'événement, capture éventuelle)" pour effectuer la liaison.

L'environnement d'exploitation de ce tutoriel : système Windows 7, JavaScript version 1.8.5, ordinateur Dell G3.

En Javascript, il existe 3 façons de lier des événements :

• Utilisez l'attribut event de la balise HTML pour lier le gestionnaire

• Utilisez l'attribut event de la source d'événement pour lier le gestionnaire

• Utilisez addEventListener() Gestionnaire de liaison

1. Utilisez la liaison d'attribut d'événement des balises HTML pour lier le gestionnaire

Syntaxe de base :

<标签 on事件名="事件处理程序" />

Exemple :

<input type=’button’ onclick=’display()’ />

Exemple de code :

Ce qui précède le code est le plus Bien que la liaison en ligne typique puisse compléter les fonctions dont nous avons besoin, elle lie structure + style + comportement dans la même balise, ce qui n'est pas propice à une maintenance ultérieure.

2. Utilisez le gestionnaire de liaison d'attribut d'événement de la source d'événement

Syntaxe de base :

dom对象.on事件名 = 事件处理程序（通常是一个匿名函数）

Améliorez la question ci-dessus grâce à l'idée de liaison dynamique. L'effet est comme indiqué dans la figure ci-dessous :

3. Utilisez addEventListener() pour lier le gestionnaire

Utiliser l'attribut event de l'objet source d'événement pour lier le gestionnaire d'événement est simple, mais il présente un inconvénient : un événement ne peut lier qu'un seul gestionnaire. , et la liaison ultérieure. Un certain gestionnaire d'événements écrasera le gestionnaire d'événements précédemment lié. Dans les applications réelles, un événement provenant d'une source d'événement peut être traité par plusieurs fonctions.

Lorsqu'une source d'événement doit être traitée à l'aide de plusieurs fonctions, vous pouvez appeler addEventListener() (pour les navigateurs standard) via la source d'événement pour lier la fonction de traitement d'événement afin de répondre à cette exigence. La façon dont une source d'événement lie plusieurs fonctions d'événement via des méthodes consiste à appeler addEventListener() plusieurs fois sur l'objet source d'événement, et chaque appel ne lie qu'une seule fonction de traitement d'événement.

addEventListener() est une méthode du modèle d'événement standard et est valable pour tous les navigateurs standards. Le format d'utilisation de addEvent Lister() pour lier un gestionnaire d'événements est le suivant :

事件源.addEventListener(事件名称,事件处理程序,是否捕获);

Le paramètre "nom de l'événement" est un nom d'événement sans "on" ; le paramètre "si capturer" est une valeur booléenne et la valeur par défaut. la valeur est fausse. Lorsque faux, la diffusion d'événements est obtenue, et lorsqu'elle est vraie, la capture d'événements est obtenue.

En appelant addEventListener() plusieurs fois, vous pouvez lier plusieurs gestionnaires d'événements au même type d'événement d'un objet source d'événement. Lorsqu'un événement se produit sur un objet, toutes les fonctions de gestion d'événements liées à l'événement seront appelées et exécutées dans l'ordre dans lequel elles ont été liées. De plus, il convient de noter que ceci dans la fonction de gestion des événements liée par addEventListener() pointe vers la source de l'événement.

addEventListener() Exemple de gestionnaire de liaison :

document.addEventListener('click',fn1,false);//click事件绑定fn1函数实现事件冒泡
document.addEventListener('click',fn2,true);//click事件绑定fn2函数实现事件捕获

[Recommandations associées : Tutoriel d'apprentissage Javascript]

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!