JS事件处理程序

JS事件处理程序：HTML事件处理程序、DOM0级事件处理程序、DOM2级事件处理程序、IE事件处理程序、跨浏览器的事件处理程序。

HTML事件处理程序

<script type="text/javascript">

function showMessage(){

　　alert("Hello world!");

}

</script>

<input type="button" value="CLICK ME" onclick="showMessage()">

DOM0级事件处理程序

将一个函数赋值给 一个事件处理程序属性。

var btn = document.getElementById("myBtn");

btn.onclick = function(){

　　alert(this.id);

}

btn.onclick=null;//删除事件处理程序

DOM2级事件处理程序

定义了2个方法，用于指定和删除事件处理程序的操作：addEventListener()和removeEventListener();

var btn = document.getElementById("myBtn");

btn.addEventListener("click",function(){

　　alert(this.id);

},false);

btn.removeEventListener("click",function(){//没用的

　　alert(this.id);

},false);

正确的写法：

var handler = function(){

　　alert(this.id);

}

btn.addEventListener("click",handler,false);

btn.removeEventListener("click",handler,false);

IE事件处理程序

IE中实现了与DOM类似的方法：attachEvent(),detachEvent();

var btn = document.getElementById("myBtn");

var handler = function(){

　　alert("Clicked");

}

btn.attachEvent("onclick",handler);

btn.detachEvent("onclick",handler);

跨浏览器的事件处理程序

var btn = document.getElementById("myBtn");

var handler = function(){

　　alert("Clicked");

}

EventUtil.addHandler(btn,"click",handler);

EventUtil.removeHandler(btn,"click",handler);