Contoh Penggunaan Contoh AddEventListener

(Perlu dicatat bahwa div harus ditempatkan di depan JS)

Secara umum, jika objek DOM terikat pada peristiwa yang sama, hanya yang terakhir yang akan berlaku, misalnya:

Salinan kode adalah sebagai berikut:

document.geteLementById ("btn"). onclick = method1;

document.geteLementById ("btn"). onclick = method2;

document.geteLementById ("btn"). onclick = method3;

Maka hanya Method3 yang akan berlaku.

Jika itu adalah seri Mozilla, gunakan AddEventListener untuk mengaktifkan beberapa acara untuk diimplementasikan secara berurutan, seperti:

Salinan kode adalah sebagai berikut:

var btn1obj = document.getElementById ("btn1");

//element.addeventListener(type, pendengar, usecapture);

btn1obj.addeventListener ("klik", method1, false);

btn1obj.addeventListener ("klik", method2, false);

btn1obj.addeventListener ("klik", method3, false);

Pesanan Eksekusi adalah Method1-> Method2-> Method3

Jika itu adalah seri IE, AttachEvent dapat memungkinkan banyak acara untuk diimplementasikan secara berurutan, seperti:

Salinan kode adalah sebagai berikut:

var btn1obj = document.getElementById ("btn1");

//object.attachevent(event.function);

btn1obj.attachevent ("onClick", method1);

btn1obj.attachevent ("onClick", method2);

btn1obj.attachevent ("onClick", method3);

Pesanan eksekusi adalah Method3-> Method2-> Method1

=======================================================================================================

Di Mozilla:

Cara menggunakan addeventlistener

target.addeventListener (ketik, pendengar, usecapture);

Target: Dokumen Node, Dokumen, Jendela, atau XMLHTTPREQUEST.

Jenis: String, nama acara, tidak mengandung "on", seperti "klik", "mouseover", "keydown", dll.

Pendengar: Mengimplementasikan antarmuka EventListener atau fungsi dalam JavaScript.

Usecapture: Apakah akan menggunakan penangkapan, umumnya menggunakan false. Misalnya: document.getElementById ("testText"). AddeventListener ("keydown", function (event) {alert (event.keycode);}, false);

Di IE:

target.attachevent (ketik, pendengar);

Target: Dokumen Node, Dokumen, Jendela, atau XMLHTTPREQUEST.

Jenis: String, nama acara, berisi "on", seperti "onClick", "onmouseover", "onkeydown", dll.

Pendengar: Mengimplementasikan antarmuka EventListener atau fungsi dalam JavaScript. Misalnya: document.getElementById ("txt"). AttachEvent ("ontClick", function (event) {waspada (event.keycode);});

W3C dan IE juga mendukung menghapus acara tertentu. Tujuannya adalah untuk menghapus acara yang ditetapkan. Formatnya adalah sebagai berikut:

RemoveEventListener (peristiwa, fungsi, tangkap/gelembung);

Format Windows IE adalah sebagai berikut:

detachevent (peristiwa, fungsi);

Evolusi DOM2:

Penggunaan DOM2 baru dapat diamati dengan menambahkan fungsi () Fungsi:

Salinan kode adalah sebagai berikut:

AddEventListener (acara, fungsi, tangkap/gelembung);

Acara parameter ditampilkan dalam tabel di atas. Fungsi adalah fungsi yang akan dieksekusi. Tangkapan dan gelembung adalah dua mode waktu yang diformulasikan oleh W3C. Sederhananya, tangkap adalah membaca baris terakhir dari awal dokumen dan kemudian jalankan acara. Bubble pertama -tama menemukan lokasi yang ditentukan dan kemudian mengeksekusi acara.

Parameter penangkapan/gelembung adalah nilai boolean, cara yang benar untuk menggunakan penangkapan, dan cara palsu untuk menggelembung. Windows Internet Explorer juga telah merumuskan EventHandler, yang dilampirkan (), dengan format sebagai berikut:

Salinan kode adalah sebagai berikut:

window.attachevent ("kirim", myfunction ());

Yang lebih istimewa adalah bahwa AttachEvent tidak perlu menentukan parameter penangkapan/gelembung, karena di lingkungan Windows IE, mode gelembung digunakan.

Bagaimana cara menentukan jenis mendengarkan mana yang didukung? menyukai:

Salinan kode adalah sebagai berikut:

if (typeof window.addeventListener! = “tidak terdefinisi”) {

window.addeventlistener ("muat", rollover, false);

} kalau tidak {

window.attachevent ("onload", rollover)

}

Jenis Window.addeventListener di atas! = Kode program "tidak ditentukan" dapat menentukan apakah browser pengguna mendukung model acara AddEventListener. Jika tidak didukung, AttachEvent akan digunakan.

W3C dan IE juga mendukung menghapus acara tertentu. Tujuannya adalah untuk menghapus acara yang ditetapkan. Formatnya adalah sebagai berikut:

Format W3C:

RemoveEventListener (peristiwa, fungsi, tangkap/gelembung);

Format Windows IE adalah sebagai berikut:

detachevent (peristiwa, fungsi);