您的位置：首页 > Web前端 > JavaScript

JavaScript事件处理程序

2013-07-26 20:24 459 查看

JavaScript中的事件处理程序主要分为3种：

HTML事件处理程序：

<script type="text/javascript">
// HTML事件处理程序
function showMessage(){
alert("clicked!");
};
</script>

<button id="btn" onclick="showMessage()">click me!</button>

DOM0级事件处理程序：　　

<button id="btn">click me!</button>

<script type="text/javascript">
var btn = document.getElementById("btn");

// DOM0 级事件处理程序
btn.onclick = function(){
alert("clicked!");
};
</script>

DOM2级事件处理程序：

<button id="btn">click me!</button>

<script type="text/javascript">
var btn = document.getElementById("btn");

// DOM2级事件处理程序, 第三个参数：false表示在冒泡阶段调用事件处理程序
btn.addEventListener("click", function(){
alert("clicked!");
}, false);
</script>

附上兼容性事件绑定函数：

function listenEvent(eventTarget, eventType, eventHandler){
if(eventTarget.addEventListener){
eventTarget.addEventListener(eventType, eventHandler, false);
}
else if(eventTarget.attachEvent){
eventType = 'on' + eventType;
eventTarget.attachEvent(eventType, eventHandler);
}
else{
eventTarget['on' + eventType] = eventHandler;
}
}

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航