Explication détaillée des événements de liaison et des événements de déliaison dans js

Cet article présente principalement les connaissances pertinentes sur les événements de liaison et les événements de déliaison js. A une très bonne valeur de référence. Jetons un coup d'œil avec l'éditeur ci-dessous

La liaison de plusieurs événements dans js utilise deux méthodes : attachEvent et addEventListener, mais il existe des différences entre ces deux méthodes

méthode attachEvent uniquement prend en charge IE678, non compatible avec d'autres navigateurs

méthode addEventListener compatible avec Firefox et Google, non compatible avec IE8 et versions antérieures

Méthode addEventListener

p.addEventListener('click',fn);

p.addEventListener('click',fn2);
function fn(){ console.log("春雨绵绵"); }

function fn2(){
        console.log("到处潮湿");
      }

Méthode attachEvent

p.attachEvent('onclick',fn);
p.attachEvent('onclick',fn2);
function fn(){ console.log("春雨绵绵"); }
function fn2(){
        console.log("到处潮湿");
      }

Remarque : L'événement lié par la méthode attachEvent est avec on, et l'événement lié par addEventListener est sans on

J'ai écrit ci-dessous Une méthode compatible avec IE et Firefox et Google

var p=document.getElementsByTagName("p")[0];
      addEvent('click',p,fn)
      function addEvent(str,ele,fn){
        ele.attachEvent?ele.attachEvent('on'+str,fn):ele.addEventListener(str,fn);
      }
      function fn(){
        console.log("春雨绵绵");
      }

Cela résout parfaitement le problème de compatibilité

S'il y a un événement de liaison, alors il doit y avoir un événement de déliaison, mais les événements de déliaison sont les mêmes que les événements de liaison. Le maléfique IE. fera toujours des spécialisations

La méthode detachEvent ne prend en charge qu'IE678 et n'est pas compatible avec d'autres navigateurs

Méthode RemoveEventListener Compatible avec Firefox et Google, non compatible avec IE8 et versions antérieures

Écriture de la méthode detachEvent :

ele.detachEvent("onclick",fn);

Comment écrire RemoveEventListener :

ele.removeEventListener("click",fn);

J'ai écrit une version de compatibilité ci-dessous La méthode est pour votre référence, et la la mise en œuvre est très simple

function remove(str,ele,fn){
        ele.detachEvent?ele.detachEvent("on"+str,fn):ele.removeEventListener(str,fn);
      }

Remarque : qu'il s'agisse d'un événement de liaison attachEvent ou d'un événement de suppression detachEvent, on doit être ajouté, RemoveEventListender et addEventListender ne sont pas requis Ajouter on

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!