绑定事件

绑定事件

使用 对象.事件 = 函数 的形式绑定响应函数,只能同时为一个元素的一个事件绑定一个响应函数,不能绑定多个,如果绑定多个,后边会覆盖掉前边的



btn.onclick = function(){
	console.log(this)
	}
btn.onmouseover = function(){
	console.log("123")
	}

addEventListener()
通过这个方法也可以为元素绑定响应函数
参数:
1.事件的字符串,不要on
2.回调函数,当事件触发时该函数会被调用
3.是否在捕获阶段触发事件,需要一个布尔值,一般都传false
使用addEventListener()可以同时为一个元素的相同事件同时绑定多个响应函数,这样当事件被触发时,响应函数将会按照函数的绑定顺序执行 这个 方法不支持IE8及以下的浏览器

btn.addEventListener("click",function(){
	console.log(this)
	alert(1)
	},false)
	btn.addEventListener("click",function(){
	alert(2)
},false)
	btn.addEventListener("click",function(){
		alert(3)
	},false)
				

attachEvent()
在IE8中可以使用attachEvent()来绑定事件
参数:
1.事件的字符串,要on
2.回调函数
这个方法也可以同时为一个事件绑定多个处理函数,不同的是它是后绑定先执行,执行顺序和addEventListener()相反

ie8 attachEvent()
	btn.attachEvent("onclick",function(){
	alert("abc")
})

定义一个函数,用来为指定元素绑定响应函数addEventListener()中的this,是绑定事件的对象
attachEvent()中的this,是window需要统一两个方法this
参数:
el 要绑定事件的对象
event 事件的字符串(不要on)
callback 回调函数

bind(btn,"click",function(){
					console.log(this)
				})
				
				function bind(el,event,callback){
					if(el.addEventListener){
						el.addEventListener(event,callback,false)
					}else{
						el.attachEvent("on"+event,function(){
							callback.call(el)
						})
					}
已标记关键词 清除标记
©️2020 CSDN 皮肤主题: 数字20 设计师:CSDN官方博客 返回首页