- 相關(guān)推薦
javascript中的綁定與解綁函數 介紹
Mozilla中:
addEventListener的使用方式:
target.addEventListener(type, listener, useCapture);
target: 文檔節點(diǎn)、document、window 或 XMLHttpRequest。
type: 字符串,事件名稱(chēng),不含“on”,比如“click”、“mouseover”、“keydown”等。
listener :實(shí)現了 EventListener 接口或者是 JavaScript 中的函數。
useCapture :是否使用捕捉,一般用 false 。例如:document.getElementById("testText").addEventListener("keydown", function (event) { alert(event.keyCode); }, false);
IE中:
target.attachEvent(type, listener);
target: 文檔節點(diǎn)、document、window 或 XMLHttpRequest。
type: 字符串,事件名稱(chēng),含“on”,比如“onclick”、“onmouseover”、“onkeydown”等。
listener :實(shí)現了 EventListener 接口或者是 JavaScript 中的函數。 例如:document.getElementById("txt").attachEvent("onclick",function(event){alert(event.keyCode);});
W3C 及 IE 同時(shí)支持移除指定的事件, 用途是移除設定的事件, 格式分別如下:
W3C格式:
removeEventListener(event,function,capture/bubble);
Windows IE的格式如下:
detachEvent(event,function);
target.addEventListener(type, listener, useCapture);
target 文檔節點(diǎn)、document、window 或 XMLHttpRequest。
type 字符串,事件名稱(chēng),不含“on”,比如“click”、“mouseover”、“keydown”等。
listener 實(shí)現了 EventListener 接口或者是 JavaScript 中的函數。
useCapture 是否使用捕捉,看了后面的事件流一節后就明白了,一般用 false
事件觸發(fā)時(shí),會(huì )將一個(gè) Event 對象傳遞給事件處理程序,比如:
document.getElementById("testText").addEventListener("keydown", function (event) { alert(event.keyCode); }, false);
適應的瀏覽器版本不同,同時(shí)在使用的過(guò)程中要注意
attachEvent方法 按鈕onclick IE中使用
addEventListener方法 按鈕click fox中使用
兩者使用的原理:可對執行的優(yōu)先級不一樣,下面實(shí)例講解如下:
attachEvent方法,為某一事件附加其它的處理事件。(不支持Mozilla系列)
addEventListener方法 用于 Mozilla系列
舉例: document.getElementById("btn").onclick = method1;
document.getElementById("btn").onclick = method2;
document.getElementById("btn").onclick = method3;如果這樣寫(xiě),那么將會(huì )只有medhot3被執行
寫(xiě)成這樣:
var btn1Obj = document.getElementById("btn1"); //object.attachEvent(event,function);
btn1Obj.attachEvent("onclick",method1);
btn1Obj.attachEvent("onclick",method2);
btn1Obj.attachEvent("onclick",method3);執行順序為method3->method2->method1
如果是Mozilla系列,并不支持該方法,需要用到addEventListener var btn1Obj = document.getElementById("btn1");
//element.addEventListener(type,listener,useCapture);
btn1Obj.addEventListener("click",method1,false);
btn1Obj.addEventListener("click",method2,false);
btn1Obj.addEventListener("click",method3,false);執行順序為method1->method2->method3
實(shí)例:(要注意的是div必須放到j(luò )s前面才行)
【javascript中的綁定與解綁函數 介紹】相關(guān)文章:
JavaScript中push(),join() 函數實(shí)例詳解09-05
Javascript函數的定義和用法分析08-15
最常用的20個(gè)javascript方法函數09-10
有關(guān)深入理解JavaScript中的并行處理的介紹10-14
JavaScript中的with關(guān)鍵字07-24
在Java中執行JavaScript代碼07-14