Heim >Web-Frontend >js-Tutorial >Eine kurze Analyse der Javascript-Überwachung von Mausradereignissen_Javascript-Fähigkeiten
Wir haben alle diese Effekte gesehen. Verwenden Sie das Mausrad, um die Zahlen in einem Formular zu erhöhen oder zu verringern, oder verwenden Sie das Mausrad, um das Scrollen einer Schaltfläche nach links und rechts sowie nach oben und unten zu steuern. Diese werden alle durch die js-Ereignisüberwachung des Mausrads implementiert. Was wir heute hier vorstellen, ist eine einfache JS-Überwachung von Mausradereignissen.
Verschiedene Ereignisse in verschiedenen Browsern
Zuallererst haben verschiedene Browser unterschiedliche Scrollrad-Ereignisse. Es gibt hauptsächlich zwei Typen: onmousewheel (nicht von Firefox unterstützt) und DOMMouseScroll (nur von Firefox unterstützt). Ich werde hier nicht näher auf diese beiden Ereignisse eingehen. Freunde, die mehr darüber erfahren möchten, gehen bitte zu: Mousewheel (Mausrad). ) und DOMMouseScroll-Ereignisse.
Außerdem muss während des Vorgangs die Ereignisüberwachung hinzugefügt werden. Der Code lautet wie folgt: Kompatibel mit Firefox, verwenden Sie addEventListener zur Überwachung
js gibt einen numerischen Wert zurück, um das Auf und Ab des Scrollrads zu beurteilen
Bei der Beurteilung, ob das Scrollrad oben oder unten ist, muss auch die Kompatibilität im Browser berücksichtigt werden. Derzeit verwendet Firefox unter den fünf wichtigsten Browsern (IE, Opera, Safari, Firefox, Chrome) Details und die anderen vier Typen verwenden nur WheelDelta. Die Werte sind inkonsistent, was bedeutet, dass Detail und WheelDelta jeweils nur zwei Werte annehmen, Detail nur ±3 und WheelDelta nur ±120 Positive Zahlen stehen für Aufwärts und negative Zahlen für Abwärts.
Der spezifische Code lautet wie folgt:
Durch Ausführen des obigen Codes können wir Folgendes sehen: