對象名.addEventListener("事件名(不帶ON)",函數名,true/false);(FF下)
對象名.attachEvent("事件名",函數名);(IE下)
說明:
事件名稱,要注意的是"onclick"要改為"click","onblur"要改為"blur",也就是說事件名不要帶"on"。
函數名,記住不要跟括號最后一個參數是個布爾值,表示該事件的響應順序,下面重點介紹一下addEventListener的第3個參數(useCapture)。 userCapture若為true,則瀏覽器采用Capture,若為false則采用bubbing方式。建議用false,看個例子吧。
html代碼
<div id="div_test"> <input type="button" id="btn_test" value="se4.cn技術基地" /> </div>
js代碼
代碼如下:
window.onload=function(){ document.getElementById("div_test").addEventListener("click",test1,false); document.getElementById("btn_test").addEventListener("click",test2,false); } function test1(){ alert("外層div觸發") } function test2(){ alert("內層input觸發") }
自己體驗一下,如果userCapture是true則test1先觸發,如果userCapture是false則test2先觸發。
下面來說一下,attachEvent
這個沒啥好說的,相信大家也都用的挺熟的,主要是傳參那塊,等我用到 再說吧,哈哈哈
示例:
創建綁定方法:
代碼如下:
if (typeof document.addEventListener != "undefined") {
document.addEventListener("mousedown",_lhlclick,true);
} else {
document.attachEvent("onmousedown",_lhlclick);
}
刪除事件:
代碼如下:
if (typeof document.addEventListener != "undefined") {
document.removeEventListener("mousedown",_lhlclick,true);
} else {
document.detachEvent("onmousedown",_lhlclick);
}