Maison > interface Web > js tutoriel > Explication détaillée de la façon d'utiliser les attributs d'événement pour lier les fonctions d'événement en JavaScript

Explication détaillée de la façon d'utiliser les attributs d'événement pour lier les fonctions d'événement en JavaScript

伊谢尔伦
Libérer: 2017-07-22 16:04:27
original
1583 Les gens l'ont consulté

Présentez d'abord la méthode générale d'ajout d'événements en js, le contenu spécifique est le suivant


<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title></title>
  </head>
  <body>
    <p id="p1">测试添加事件:firefox使用addEventListener,ie使用attachEvent<br>
    点击此p标签,绑定了2个弹出事件</p>
    <script>
      function test1() {
        alert("test1");
      }
      function test2(){
        alert("test2");
      }
      //添加事件通用方法
      function addEvent(element,e,fn) {
        //firefox使用addEventListener,来添加事件
        if(element.addEventListener) {
          element.addEventListener(e,fn,false);
        }
        //ie使用attachEvent,来添加事件
        else {
          element.attachEvent("on"+e,fn);
        }
      }
      window.onload = function(){
        var element = document.getElementById("p1");
        addEvent(element,"click",test1);
        addEvent(element,"click",test2);
      }
    </script>
  </body>
</html>
Copier après la connexion

La manière courante des événements de liaison en js :

Comment lier des événements : utiliser les attributs d'événement pour lier des fonctions d'événement
Avantages :

1 Compléter la séparation des comportements
2. Facile à utiliser l'objet, car Function apparaît comme un attribut de on***, et vous pouvez l'utiliser directement pour faire référence à l'objet en question.
3. Il est pratique de lire l'objet événement. Lorsque l'événement est déclenché, le système transmet automatiquement l'objet événement à la fonction événement


<.>

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal