<html lang="en">
<head>
<meta charset="UTF-8">
<title>title</title>
</head>
<body>
<input type="button" value="小苏" id="btn"/>
<input type="button" value="干掉第一个按钮的事件" id="btn2"/>
<script>
//第一种绑定事件与解除绑定事件的区别
//对象.on事件名字=事件处理函数------>绑定事件
//绑定
document.getElementById("btn").onclick = function(){
console.log("第一种绑定事件的方法");
}
//解除绑定
document.getElementById("btn2").onclick = function(){
document.getElementById("btn").onclick = null;
}
//第二种方式绑定事件与解除绑定
function f1(){
console.log("第一个");
}
function f2(){
console.log("第二个");
}
//绑定
document.getElementById("btn").addEventListener("click",f1,false);
document.getElementById("btn").addEventListener("click",f2,false);
//点击第二个按钮，把第一个按钮解除绑定
document.getElementById("btn2").onclick = function(){
document.getElementById("btn").removeEventListener("click",f1,false);
};
//第三种方法
//绑定
document.getElementById("btn").attachEvent("onclick",f1);
document.getElementById("btn").attachEvent("onclick",f2);
//解除绑定
document.getElementById("btn2").onclick = function(){
document.getElementById("btn").detachEvent("onclick",f1);
};
</script>
</body>
</html>
2.绑定事件与解除绑定事件的区别
//解绑事件:
/*
* 注意:用什么方式绑定事件,就应该用对应的方式解绑事件
* 1.解绑事件
* 对象.on事件名字=事件处理函数--->绑定事件
* 对象.on事件名字=null;
* 2.解绑事件
* 对象.addEventListener("没有on的事件类型",命名函数,false);---绑定事件
* 对象.removeEventListener("没有on的事件类型",函数名字,false);
* 3.解绑事件
* 对象.attachEvent("on事件类型",命名函数);---绑定事件
* 对象.detachEvent("on事件类型",函数名字);
*
*
* */
扫一扫
1573
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
