Das native JS-Bindungs-Pullover-Scroll-Ereignis ist mit gängigen Browser-Javascript-Kenntnissen kompatibel

Das Ereignis des Scrollens der Seite mit dem Rad tritt bei Spezialeffekten auf Webseiten auf, aber die Implementierungsmethoden sind in verschiedenen Browsern unterschiedlich. Die von mir unten implementierte Methode ist mit gängigen Browsern kompatibel.

function getData(event){ 
var e = event || window.event; 
//获取滚动距离(FF每次滚动 data为3或者-3，其他为120或者-120) 
var data = e.detail || e.wheelDelta; 
alert(data); 
} 

//IE之外的绑定事件方法 
if(document.addEventListener && !document.attachEvent) 
{ 
document.addEventListener('mousewheel',getData); 
//FF绑定滚动事件 
document.addEventListener('DOMMouseScroll',getData); 
} 
//IE 
else if(document.attachEvent && !document.addEventListener){ 
document.attachEvent('onmousewheel',getData); 
}else{ 
window.onmousewheel = getData; 
}

Bemerkenswerte Stellen im Code:

1 Warum document.addEventListener && !document.attachEvent verwenden, um IE zu unterscheiden?

attachEvent und detachEvent sind IE-spezifische Methoden zum Binden und Entbinden von Ereignissen. Diese Methode existiert nur im IE. Im IE9-Browser ist jedoch eine allgemeinere addEventListener-Methode implementiert, um Ereignisse zu binden. Wenn im Browser eine document.addEventListener-Methode vorhanden ist, können Sie Versionen ausschließen, die nicht IE8 und niedriger sind, aber den IE9-Browser enthalten. Verwenden Sie daher &&!document.attachEvent später, um den IE9-Browser auszuschließen.

2 Es ist erwähnenswert, dass es im FF-Browser kein Mausradereignis gibt und der Zeitpunkt zum Auslösen des Scrollens DOMMouseScroll ist.

3 Eine weitere erwähnenswerte Sache ist, dass bei der Verwendung von addEventListener zum Binden eines Ereignisses „on“ nicht vor dem Ereignisnamen hinzugefügt wird, bei der Verwendung von „attachEvent“ zum Binden eines Ereignisses im IE jedoch „on“ erforderlich ist.