Encapsulate DOM Level 0 Event Handler dan pawang Event Handler Level DOM2 IE Event Handler ke dalam objek Eventutil untuk mencapai efek lintas-browser. Kodenya adalah sebagai berikut:
var eventUtil = {// Tambahkan event handle addeventhandler: function (element, type, handler) {if (element.addeventListener) {element.addeventListener (type, handler, false);} lain if (element.attachevent) {element.attachevent ("on"+type, handler);} lain Acara menangani RemestEventhandler: Function (Element, Type, Handler) {if (element.removeEventListener) {element.removeEventListener (type, handler, false);} else if (element.detachevent) {element.detachevent ("on"+handler);} element {{{{{"on" getEvent: function (event) {return event? event: window.event;}, // dapatkan jenis acara getType: function (event) {return event.type;}, // dapatkan objek target objek getTarget: function (event) {if event.target) {return event.target; {if (event.target) {return event.target;} else {return event.srcelement;}}, // Dapatkan target objek event getTarget: function (event) {if (event.target) {return event.target;} else {return event.srcelement;}}, // stop event.target;} else {return event.srcelement;},// stop event.target;} else {return event.srcelement;},// stop event. (event.stoppropagation) {event.stoppropagation ();} else {event.cancelbubble = true;}}, // cegah peristiwa default perilaku preventDefault: function (event) {if (event.preventDefault) {event.preventDefault (); {event.preventDefault) {event.preventDefault ();} {event.preventDefault) {event.preventDefault ();} {event.preventDefault) {event.preventDefault ();} {event.preventDefault) {event.preventDefault ();} lain {event.Saat mempraktikkan kode, saya membuat beberapa kesalahan, yang menyebabkan kesalahan operasi. Rekam dan memperdalam ingatan saya.
① Menambahkan pegangan adalah lokasi di mana parameter dikaburkan: pertama, parameter addeventhandler (elemen, jenis, penangan) masing -masing mewakili elemen elemen mana yang ditambahkan ke acara, jenis acara, dan penangan fungsi penanganan acara. Anda cenderung membingungkan posisi pawang dan false (mewakili tahap menggelegak) di AddEventLister nanti (tipe, handler, false).
Mengarah ke hasil: Selama proses penulisan, saya memikirkannya dengan hati -hati dan memahami parameter mana yang dibutuhkan oleh Addeventhandler, dan kemudian saya tahu parameter mana yang akan digunakan pada posisi mana. Akhirnya, saya menulisnya dengan benar, dan tidak menyebabkan kesalahan.
Solusi: Memahami dan Ingat.
② Dalam IE Event Handler Judgment Branch, Attachevent dan Detachevent dieja secara tidak benar, dan peristiwa hilang, dan hanya melampirkan atau melepaskan yang ditulis.
Karena hasilnya: Meskipun tidak ada kesalahan, tidak mungkin untuk menambah atau menghapus peristiwa di IE menggunakan AddEventhandler dan RemestEventhandler.
Solusi: Latih lebih banyak dan ingatlah. lampiran dan detachevent.
③ Lupa menambahkan "pada" ke parameter event handler IE attachEvent dan detachevent; itu ditulis sebagai attachEvent (tipe, handler). Faktanya, yang benar harus lampiran ("on"+type, handler), dan saya juga lupa bahwa ada cabang penilaian untuk pemrosesan acara tingkat DOM0.
Penyebab Hasil: Demikian pula, pemrosesan acara tidak kompatibel. Menambahkan atau menghapus acara menggunakan metode yang dienkapsulasi pada IE tidak dapat berhasil.
Solusi: Hanya ingat. Hal lain yang perlu diperhatikan: elemen ["on"+type] digunakan dalam acara level DOM0. Misalnya, elemen ["on"+"klik"] setara dengan elemen.onklick.
Atribut Atribut terakhir juga ditambahkan dengan koma di akhir, seperti perilaku default preventdefault saat memblokir acara: tambahkan koma setelah selesai, seperti cuplikan kode berikut (komentar)
preventDefault: function (event) {if (event.preventDefault) {event.preventDefault ();} else {event.returnValue = false;}}, // Properti terakhir preventdefault ditambahkan dengan koma setelah diselesaikan, kesalahan akan terjadi}Penyebab Hasilnya: Kesalahan dilaporkan ketika berjalan di IE (di mana baris 54 dari Event.js adalah baris berikutnya dari koma terakhir, yang sebenarnya disebabkan oleh koma; baris 10 test.html dipanggil karena Metode Evenutil.Addeventhandler di Event.js dipanggil)
Solusi: Tidak diragukan lagi, hapus saja koma terakhir.
⑤ Masih kesalahan ejaan. Properti Batalbubble di IE yang mencegah acara dari Bubbled Up telah ditulis dengan satu lagi S, yang ditulis sebagai cancelbubbles.
Hasil: Tidak ada kesalahan yang dilaporkan, tetapi peristiwa di IE tidak dapat dicegah dari menggelegak.
Solusi: Ubah kembali
Di atas adalah masalah kesalahan tingkat rendah yang JavaScript merangkum pawang acara DOM menjadi event.js yang diperkenalkan oleh editor. Saya harap ini akan membantu semua orang. Jika Anda memiliki pertanyaan, silakan tinggalkan saya pesan dan editor akan membalas semua orang tepat waktu. Terima kasih banyak atas dukungan Anda ke situs web Wulin.com!