为元素绑定事件和解绑事件的兼容代码!
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<input type="button" value="按钮" id="btn1"/>
<input type="button" value="清除第一个按钮" id="btn2"/>
<script src="common.js">
//绑定事件的兼容
function addEventListener(element,type,fn) {
if(element.addEventListener) {
element.addEventListener(type,fn,false);
}else if(element.attachEvent) {
element.attachEvent("on" + type,fn);
}else{
element["on" + type] = fn; //对象.什么可以用中括号来代替
}
}
//解绑事件的兼容
//为任意的一个元素,解绑对应的事件
function removeEventListener(element,type,fnName) {
if(element.removeEventListener) {
element.removeEventListener(type,fnName,false);
}else if(element.detachEvent) {
element.detachEvent("on" + type,fnName);
}else {
element["on" + type] =null;
}
}
function f1() {
console.log("第一个");
}
function f2() {
console.log("第二个");
}
addEventListener(my$("btn1"),"click",f1);
addEventListener(my$("btn1"),"click",f2);
my$("btn2").onclick =function () {
removeEventListener(my$("btn1"),"click",f1);
};
</html>
网友评论