cari

Rumah >hujung hadapan web >tutorial js >Contoh analisis penggunaan attachEvent dalam kemahiran javascript_javascript

Contoh analisis penggunaan attachEvent dalam kemahiran javascript_javascript

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBasal
2016-05-16 15:59:021215semak imbas

Contoh dalam artikel ini menerangkan penggunaan attachEvent dalam javascript. Kongsikan dengan semua orang untuk rujukan anda. Analisis khusus adalah seperti berikut:

Secara amnya kami menambah acara dalam JS seperti ini

obj.onclick=method

Kaedah mengikat acara ini serasi dengan penyemak imbas arus perdana, tetapi bagaimana jika acara yang sama ditambahkan beberapa kali pada elemen?

obj.onclick=method1
obj.onclick=method2
obj.onclick=method3

Jika anda menulisnya seperti ini, maka hanya acara terikat terakhir, di sini kaedah 3, akan dilaksanakan Pada masa ini, kami tidak boleh menggunakan onclick Protagonis telah berubah 

btn1Obj.attachEvent("onclick",method1);
btn1Obj.attachEvent("onclick",method2);
btn1Obj.attachEvent("onclick",method3);

Format didahului oleh jenis acara Ambil perhatian bahawa anda perlu menambah, seperti onclick, onsubmit, onchange

kaedah3->kaedah2->kaedah1

Malangnya, kaedah peribadi Microsoft ini tidak disokong oleh Firefox dan penyemak imbas lain Nasib baik, mereka semua menyokong kaedah addEventListener standard W3C 

btn1Obj.addEventListener("click",method1,false);
btn1Obj.addEventListener("click",method2,false);
btn1Obj.addEventListener("click",method3,false);

Arahan pelaksanaan ialah kaedah1->kaedah2->kaedah3 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>attachEvent</title>
<script type="text/javascript">
//第一种方式(微软的私人方法)
function iniEvent() {
  var btn = document.getElementById("btn");
  btn.attachEvent("onclick", click1);
  btn.attachEvent("onclick", click2);
  btn.attachEvent("onclick", click3);
}
//第二种方式(火狐和其他浏览器)
function iniEvent2() {
  var btn = document.getElementById("btn");
  btn.addEventListener("click", click1, false);
  btn.addEventListener("click", click2, false);
  btn.addEventListener("click", click3, false);
}
function click1() {
  alert('click1');
}
function click2() {
  alert('click2');
}
function click3() {
  alert('click3');
}
</script>
</head>
<body onload="iniEvent()">
<input type="button" id="btn" value="attachEvent" />
</body>
</html>
Saya harap artikel ini akan membantu reka bentuk pengaturcaraan JavaScript semua orang.

Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：Javascript mencetak secara rekursif Dokumen contoh perhubungan hierarki kemahiran analisis_javascriptArtikel seterusnya：Javascript mencetak secara rekursif Dokumen contoh perhubungan hierarki kemahiran analisis_javascript

Artikel berkaitan

Lihat lagi