Bacaan terkait:
JavaScript Event Learning Ringkasan (V) Jenis acara tikus di JS
//www.vevb.com/article/86259.htm
JavaScript Ringkasan Pembelajaran Acara (i) Aliran Acara
//www.vevb.com/article/86261.htm
Ringkasan Pembelajaran Acara Javascript (IV) Anggota Umum Acara (Properti dan Metode)
//www.vevb.com/article/86262.htm
Ringkasan Pembelajaran Acara Javascript (II) JS Event Handler
//www.vevb.com/article/86264.htm
Ringkasan Pembelajaran Acara Javascript (III) Objek Acara JS
//www.vevb.com/article/86266.htm
1. Objek acara
1. Memahami objek acara
Peristiwa ada di browser sebagai objek, yaitu peristiwa. Memicu suatu acara akan menghasilkan acara objek acara, yang berisi semua informasi yang terkait dengan acara tersebut. Termasuk elemen yang menghasilkan acara, jenis acara, dan informasi lain yang terkait dengan acara tertentu.
Misalnya: acara yang dihasilkan oleh operasi mouse akan berisi informasi tentang posisi mouse; Acara yang dihasilkan oleh operasi keyboard akan berisi informasi yang terkait dengan tombol yang ditekan.
Semua browser mendukung objek acara, tetapi metode dukungannya berbeda. Di DOM, objek acara harus diteruskan ke fungsi penanganan acara sebagai parameter unik. Dalam IE, acara adalah atribut objek jendela.
2. Acara di HTML Event Handler
<input id = "btn" type = "tombol" value = "klik" ontClick = "console.log ('html event handler'+event.type)"/>Ini menciptakan fungsi yang berisi acara variabel lokal. Objek acara dapat diakses secara langsung melalui acara.
3. Objek acara di DOM
Penangan acara di level DOM0 dan Level DOM2 akan lulus acara sebagai parameter.
<body> <input id = "btn" type = "Tombol" value = "klik"/> <script> var btn = document.getElementById ("btn"); btn.onClick = function (event) {console.log ("dom0 & klik"); console.log (event.type); //click}btn.addeventListener("Click ", function (event) {console.log (" dom2 & klik "); console.log (event.type); // klik}, false); </script> </body>4. Objek acara di IE
Kasus pertama: Saat menambahkan event handler melalui metode level DOM0, objek peristiwa ada sebagai atribut objek jendela.
<body> <input id = "btn" type = "Tombol" value = "klik"/> <script> var btn = document.getElementById ("btn"); btn.onClick = function () {var event = window.event; console.log (event.type); // Klik} </script> </body>Kasus kedua: event handler ditambahkan melalui attachEvent (), dan objek peristiwa dilewati sebagai parameter.
<body> <input id = "btn" type = "tombol" value = "klik"/> <script> var btn = document.geteLementById ("btn"); btn.attachevent ("ontClick", function (type) {console.log (event.type);//klik}) </script>Tapi saya tidak mengerti dua hal.
1. Parameter acara juga dapat diteruskan ke pawang acara yang ditambahkan melalui metode level DOM0. Jenisnya sama dengan window.event.type, tetapi parameter acara yang dilewati berbeda dari window.event. Mengapa?
btn.onClick = function (event) {var event1 = window.event; console.log ('event1.type ='+event1.type); //event1.type=ClickConsole.log('event.type='+event.type); //event.type=ClickConsole.log('event1==event?'+(event==event1)); // event1 == event? false}2. Acara yang disahkan di event handler ditambahkan melalui attachEvent berbeda dari window.event. Mengapa?
<body> <input id = "btn" type = "Tombol" value = "klik"/> <script> var btn = document.getElementById ("btn"); btn.attachevent ("ontClick", function (type) {console.log (event.type); //clickconsole.log("event==window.event?"+(Event==window.event));Di atas adalah ringkasan pengetahuan terkait Event Learning (III) tentang objek acara JS yang diperkenalkan oleh editor. Saya harap ini akan membantu semua orang. Jika Anda ingin tahu lebih banyak, harap perhatikan situs web Wulin.com!