Objek peristiwa: (Objek acara adalah properti objek jendela. Ketika suatu peristiwa terjadi, objek peristiwa dihasilkan pada saat yang sama. Acara berakhir dan objek acara menghilang)
Yaitu: window.event; // dapatkan objek
Dalam Dom: Argumen [0]; // Dapatkan Objek
Metode Atribut Umum untuk Objek Acara di IE:
1.ClientX: Ketika peristiwa terjadi, koordinat x pointer mouse di area klien (tidak termasuk bilah alat, scrollbar, dll.);
2.Clienty: Ketika suatu peristiwa terjadi, koordinat Y dari penunjuk mouse di area klien (tidak termasuk bilah alat, scrollbar, dll.);
3.KeyCode: Untuk acara kode kunci, ini menunjukkan karakter unicode dari tombol yang ditekan, dan untuk acara Keydown/Keyup, ini menunjukkan bahwa keyboard yang ditekan adalah indikator numerik (mendapatkan nilai tombol);
4. OFFSETX: Koordinat X dari penunjuk mouse relatif terhadap objek yang menyebabkan peristiwa tersebut;
5.Offsety: Koordinat Y pointer mouse relatif terhadap objek yang menyebabkan peristiwa tersebut;
6.Srelement: Elemen yang menyebabkan peristiwa terjadi;
Metode atribut umum untuk objek peristiwa di DOM:
1.ClientX;
2.Clienty;
3.Pagex; koordinat x pointer mouse relatif terhadap halaman;
4.Pagey; koordinat y pointer mouse relatif terhadap halaman;
5. Stoppropagasi: Memanggil metode ini dapat mencegah penyebaran peristiwa lebih lanjut (menggelegak);
6.Target: elemen/objek peristiwa yang dipicu;
7.Type: nama acara;
Persamaan dan perbedaan antara dua objek acara :
Kesamaan:
1. Dapatkan jenis acara;
2. Dapatkan kode keyboard (Keydown/Keyup Event);
3. Deteksi shift, alt, ctrl;
4. Dapatkan koordinat area klien;
5. Dapatkan koordinat layar;
Perbedaan:
1. Dapatkan target;
// yaitu: var otarget = oevent.srcelement;
// dom: var otarget = oevent.target;
2. Dapatkan kode karakter;
// yaitu: var icharcode = oevent.keycode;
// dom: var icharcode = oevent.charcode;
3. Perilaku default dari peristiwa pemblokiran;
// yaitu: oevent.ReturnValue = false;
// dom: oevent.preventdefault;
4. Berhenti menggelembung:
//Ie:oevent.cancelbubble=true;
//Dom:oevent.stoppropagation
Jenis acara:
1. Acara Mouse:
Onmouseover: Saat mouse dipindahkan;
Onmouseout: Saat mouse dipindahkan;
Onmousedown: Saat mouse ditekan;
Onmouseup: Saat mouse dinaikkan;
OnClick: Saat mengklik tombol kiri mouse;
ondBlClick: Saat klik dua kali tombol mouse kiri;
2. Acara keyboard:
Onkeydown: terjadi ketika pengguna menekan tombol pada keyboard;
Onkeyup: terjadi ketika pengguna melepaskan tombol yang ditekan;
Keypress: Ketika pengguna terus menekan tombol;
Acara Three.html:
Onload: Saat memuat halaman;
Onunload: Saat menghapus instalan halaman;
Abort: Jika pengguna belum sepenuhnya direproduksi sebelum proses pemuatan diakhiri, acara abort akan terjadi jika ia belum sepenuhnya direproduksi.
Kesalahan: peristiwa yang dihasilkan ketika kesalahan terjadi di JavaScript;
Pilih: Acara Pilih yang dipicu saat pengguna memilih karakter dalam input atau TextArea
Ubah: Dalam input atau tekstaria, saat kehilangan fokus, peristiwa perubahan dipicu di Select
Kirim: Ketika formulir diajukan, acara pengiriman dipicu;
Reset: Reset
Ubah Ukuran: Peristiwa yang dipicu saat jendela atau bingkai diubah ukurannya;
Gulir: Acara yang ditembakkan ketika pengguna menggulir atau memiliki bilah gulir;
Fokus: Saat fokus hilang;
Blur: Saat Anda mendapatkan fokus;
Model acara JavaScript
1. Model acara JavaScript: 1. Jenis gelembung: <input type = "Tombol"> Ketika pengguna mengklik tombol: input-body-html-document-window (gelembung dari bawah ke atas) IE browser hanya menggunakan gelembung
2. Tipe Capture: <Input type = "Tombol"> Saat pengguna mengklik tombol: Window-Document-HTML-Body-Input (dari atas ke bawah)
Setelah standardisasi ECMA, browser lain mendukung dua jenis, dan penangkapan terjadi terlebih dahulu.
2. Tiga cara untuk menulis acara tradisional:
1. <input type = "tombol" ontClick = "waspada ('helloWorld!')">
2. <input type = "Tombol OnClick = name1 ()"> ====== <cript> function name1 () {alert ('HelloWord!');} </cript> // Fungsi Nama
3. <input type = "tombol" id = "input1"> // fungsi anonim
Salinan kode adalah sebagai berikut:
<script>
Var button1 = document.geteLementById ("input1");
Button1.onClick = funtion () {
waspada ('helloword!')
}
</script>
3. Metode Penulisan Acara Modern:
Salinan kode adalah sebagai berikut:
<input type = "tombol" id = "input1"> // Tambahkan peristiwa di IE
<script>
var fnclick () {
Peringatan ("Saya diklik")
}
var oinput = document.getElementById ("input1");
Oinput.attachevent ("onClick", fnclick);
--------------------------------------
Oinput.detachevent ("onClick", fnclick); // hapus acara di IE
</script>
Salinan kode adalah sebagai berikut:
<input type = "tombol" id = "input1"> // Tambahkan peristiwa di DOM
<script>
var fnclick () {
Peringatan ("Saya diklik")
}
var oinput = document.getElementById ("input1");
Oinput.addeventListener ("onClick", fnclick, true);
--------------------------------------
Oinput.removeeventListener ("onClick", fnclick); // hapus acara di DOM
</script>
Salinan kode adalah sebagai berikut:
<input type = "Tombol" id = "input1"> // kompatibel dengan Acara Penambahan IE dan DOM
<script>
var fnclick1 = function () {alert ("Saya diklik")}
var fnclick2 = function () {alert ("Saya diklik")}
var oinput = document.getElementById ("input1");
if (document.attachevent) {
Oinput.attachevent ("onClick", fnclick1)
Oinput.attachevent ("onClick", fnclick2)
}
else (document.addeventlistener) {
Oinput.addeventListener ("klik", fnclick1, true)
Oinput.addeventListener ("klik", fnclick2, true)
}
</script>