事件的绑定-addEventListener

时间：2021-01-11 23:00:48 阅读：27 评论：0 收藏：0 [点我收藏+]

利用函数addEventListener（‘事件’，function （）{}）可以是同个元素执行多个程序

big.addEventListener(‘click‘,function(){   
    console.log("大");
},true) //在函数后面加true可以使这个div在捕捉阶段就被捕捉输出
middle.addEventListener(‘click‘,function(){
    console.log("中");
})
small.addEventListener(‘click‘,function(){
    console.log("小");
},true)

系统提供了一个方法，addEventListener() - 可以将同类型的事件绑定多次

语法：标签.addEventListener(事件类型,函数)

参数3是可选项，是布尔值，默认false - 是否在捕获阶段执行

box.addEventListener(‘click‘,function(){

console.log("点击了div");

})

这种绑定方式在低版本ie中不兼容

ie中换写法 - 标签.attachEvent(on+事件类型,函数)

box.attachEvent(‘onclick‘,function(){
     console.log("点击了div");
 })

封装万能的绑定事件的函数

function bindEvent(ele,type,handler){
    if(ele.addEventListener){
        ele.addEventListener(type,handler)
    }else if(ele.attachEvent){
        ele.attachEvent(‘on‘+type,handler)
    }else{
        ele[‘on‘ + type] = handler
    }
}
function fn(){
    console.log("点击了div");   
}

bindEvent(box,‘click‘,fn)

function fun(){
    console.log("进来了");
}
bindEvent(box,‘mouseover‘,fun)

事件的绑定-addEventListener

原文：https://www.cnblogs.com/mrxiachongyu/p/14264392.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年09月23日 (328)
2021年09月24日 (313)
2021年09月17日 (191)
2021年09月15日 (369)
2021年09月16日 (411)
2021年09月13日 (439)
2021年09月11日 (398)
2021年09月12日 (393)
2021年09月10日 (160)
2021年09月08日 (222)