Asas Javascript (2) Events_Basic Knowledge

Objek peristiwa: (Objek peristiwa ialah sifat objek tetingkap. Apabila peristiwa berlaku, objek peristiwa dijana pada masa yang sama. Apabila peristiwa tamat, objek peristiwa hilang)

Dalam IE: window.event;//Dapatkan objek

Dalam DOM: argument[0];//Dapatkan objek

Kaedah atribut yang biasa digunakan untuk objek Acara dalam IE:

1.clientX: Apabila peristiwa berlaku, koordinat X penuding tetikus dalam kawasan klien (tidak termasuk bar alat, bar skrol, dll.);

2.clientY: Apabila peristiwa berlaku, koordinat Y penuding tetikus dalam kawasan klien (tidak termasuk bar alat, bar skrol, dll.);

3.Kod kekunci: Untuk peristiwa Kod kekunci, nyatakan aksara Unikod kekunci yang ditekan Untuk acara kekunci/kekunci, nyatakan bahawa papan kekunci yang ditekan ialah penunjuk angka (dapatkan nilai kekunci itu);

4.offsetX: X koordinat penuding tetikus berbanding objek yang mencetuskan acara;

5.offsetY: Koordinat Y penuding tetikus berbanding objek yang mencetuskan acara;

6.srcElement: Unsur yang menyebabkan peristiwa itu berlaku;

Kaedah atribut yang biasa digunakan untuk objek acara dalam DOM:

1.clientX;

2.klienY; 3.pageX; X koordinat penuding tetikus berbanding halaman

4.halamanY; Y koordinat penunjuk tetikus berbanding halaman

5.StopPropagation: Memanggil kaedah ini boleh menghalang penyebaran lanjut (gelembung) acara;

6.sasaran: elemen/objek peristiwa tercetus;

7.jenis: nama acara;

Persamaan dan perbezaan antara dua objek acara

:

Mata yang sama:

1. Dapatkan jenis acara;

2. Dapatkan kod papan kekunci (acara keydown/keyup);

3. Kesan Shift, Alt, Ctrl; 4. Dapatkan koordinat kawasan pelanggan; 5. Dapatkan koordinat skrin;

Perbezaan:

1. Dapatkan sasaran;

//IE: var oTarget=oEvent.srcElement;

//DOM: var oTarget=oEvent.target;

2. Dapatkan kod aksara;

//IE: var iCharCode=oEvent.keyCode;

//DOM: var iCharCode=oEvent.charCode;

3. Sekat kelakuan lalai acara

//IE: oEvent.returnValue=false;

//DOM: oEvent.preventDefault;

4. Tamatkan menggelegak:

//IE:oEvent.cancelBubble=true;

//DOM:oEvent.stopPropagation

Jenis acara:

1. Acara tetikus:

onmouseover: apabila tetikus bergerak masuk;

onmouseout: apabila tetikus bergerak keluar;

onmousedown: apabila tetikus ditekan

onmouseup: apabila tetikus diangkat;

onclick: apabila mengklik butang kiri tetikus;

ondblclick: apabila mengklik dua kali butang tetikus kiri; 2. Acara papan kekunci:

onkeydown: Berlaku apabila pengguna menekan kekunci pada papan kekunci

onkeyup: Berlaku apabila pengguna melepaskan kekunci yang ditekan

tekan kekunci: Apabila pengguna terus menekan kekunci

3. Acara HTML:

onload: semasa memuatkan halaman;

memuat: semasa memunggah halaman;

batalkan: Apabila pengguna menamatkan proses pemuatan, jika ia belum dimuatkan sepenuhnya, peristiwa pengguguran berlaku

ralat: peristiwa dijana apabila ralat JavaScript berlaku;

pilih: Dalam kawasan input atau teks, apabila pengguna memilih aksara, acara pilih dicetuskan perubahan: Dalam kawasan input atau teks, apabila ia hilang fokus, peristiwa perubahan dicetuskan dalam pilihan

serahkan: Apabila borang diserahkan, acara serah dicetuskan

set semula:Tetapkan semula

saiz semula: peristiwa dicetuskan apabila saiz tetingkap atau bingkai diubah saiz

tatal: peristiwa dicetuskan apabila pengguna menatal atau mempunyai bar tatal fokus: apabila fokus hilang

kabur: apabila mendapat fokus

Model acara Javascript

1.Model acara Javascript: 1. Jenis menggelegak: Apabila pengguna mengklik butang: input-body-html-document-window (gelembung dari bawah ke atas) IE menyemak imbas peranti hanya menggunakan menggelegak

2. Jenis tangkapan: Apabila pengguna mengklik butang: window-document-html-body-input (dari atas ke bawah)

Selepas penyeragaman ECMA, pelayar lain menyokong kedua-dua jenis, tangkapan berlaku dahulu.

2. Tiga cara menulis acara tradisional:

1.

2.======nama fungsi1(){alert('helloword!');} /Fungsi terkenal

3. //Fungsi tanpa nama

Salin kod

Kod adalah seperti berikut:

Var button1=document.getElementById("input1");

button1.onclick=funtion(){

alert('helloword!')

}

3. Cara menulis acara moden:

Salin kod Kod adalah seperti berikut:

//Tambah acara dalam IE

var fnclick(){
alert("Saya telah diklik")
}
var Oinput=document.getElementById("input1");
Oinput.attachEvent("onclick",fnclick);
---------------------------------------------------
Oinput.detachEvent("onclick",fnclick);//Padam acara dalam IE

Salin kod Kod adalah seperti berikut:

//Tambah acara dalam DOM

var fnclick(){
alert("Saya telah diklik")
}
var Oinput=document.getElementById("input1");
Oinput.addEventListener("onclick",fnclick,true);
---------------------------------------------------
Oinput.removeEventListener("onclick",fnclick);//Padam acara dalam DOM

Salin kod Kod adalah seperti berikut:

//Serasi dengan acara penambahan IE dan DOM

var fnclick1=function(){alert("Saya telah diklik")}
var fnclick2=function(){alert("Saya telah 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)
}