事件的绑定
Posted sspofa
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了事件的绑定相关的知识,希望对你有一定的参考价值。
事件的绑定
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
window.onload=function(){
var btn01=document.getElementById("btn01");
/*
使用对象.事件=函数 的形式绑定响应函数
她只能同时为一个元素的一个事件绑定一个响应事件
*/
// btn01.onclick=function(){
// alert("123");
// }
// addEventListener(); 通过这个方法 也可以为元素绑定事件
/*
参数
1.事件的字符串,不要on
2.回掉函数,当事件触发时该函数会被调用
3.是否在捕获阶段触发事件,需要一个布尔值,一般都传false
*/
// btn01.addEventListener("click",function(){alert(1);},false);
// btn01.addEventListener("click",function(){alert(2);},false);
/*
attachEcent()
- 在IE8中可以使用attachEvent()来绑定事件
- 参数
1.事件的字符串,要on
2.回调函数
可以同时为一个事件绑定多个处理函数
不同的是他是后绑定先执行,执行顺序和addEventListener()相反
*/
bind(btn01,"click",function(){
alert(this);
})
}
// 定义一个函数,用来为指定元素绑定响应函数?
// addEventListener()中的this,是绑定事件的对象?
// attachEvent()中的this,是window
/*
参数
obj 要绑定事件的字符串
eventStr 事件的字符串
callback 回调函数
*/
function bind(obj,eventStr,callback){
if(obj.addEventListener){
// 大部分浏览器兼容的方式
obj.addEventListener(eventStr,callback,false);
}else{
/*
this是谁由调用方式决定的
callbank.call(obj)
*/
// IE8及以下
obj.attachEvent("on"+eventStr,function(){
// 在匿名函数中调用回掉函数
callback.call(obj);
});
}
}
</script>
</head>
<body>
<button type="button" id="btn01">btn01</button>
</body>
</html>
以上是关于事件的绑定的主要内容,如果未能解决你的问题,请参考以下文章