Rumah > Artikel > hujung hadapan web > Acara tatal takal mengikat JS asli serasi dengan kemahiran browsers_javascript biasa
Peristiwa halaman tatal roda ditemui dalam kesan khas halaman web, tetapi kaedah pelaksanaan berbeza dalam penyemak imbas yang berbeza. Kaedah yang saya laksanakan di bawah adalah serasi dengan pelayar biasa.
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; }
Tempat yang patut diberi perhatian dalam kod:
1 Mengapa menggunakan document.addEventListener && !document.attachEvent untuk membezakan IE?
attachEvent dan detachEvent ialah kaedah khusus IE untuk acara mengikat dan acara tidak mengikat Kaedah ini hanya wujud dalam IE. Walau bagaimanapun, dalam pelayar IE9, kaedah addEventListener yang lebih umum dilaksanakan untuk mengikat acara. Jika terdapat kaedah document.addEventListener dalam penyemak imbas, anda boleh mengecualikan versi yang bukan IE8 dan ke bawah, tetapi menyertakan penyemak imbas IE9, jadi gunakan &&!document.attachEvent kemudian untuk mengecualikan penyemak imbas IE9.
2 Perlu diingat bahawa tiada acara roda tetikus dalam penyemak imbas FF, dan masa untuk mencetuskan penatalan ialah DOMMouseScroll.
3 Perkara lain yang perlu diberi perhatian ialah apabila menggunakan addEventListener untuk mengikat acara, on tidak ditambahkan di hadapan nama acara, tetapi apabila menggunakan attachEvent untuk mengikat acara dalam IE, on diperlukan.