码迷,mamicode.com
首页 > Web开发 > 详细

封装Js事件代理方法

时间:2016-03-15 23:37:01      阅读:623      评论:0      收藏:0      [点我收藏+]

标签:

// 封装事件代理

function delegateEvent(element, tag, event, listener) {
    // 判断是否支持addEventlistener
    if(element.addEventListener){
        // 给父元素添加事件
        element.addEventListener(event,function(e){
            // 获取当前触发的元素
            var target = e.target;
            // 判断当前元素是否是我需要的
            if(target.nodeName.toLowerCase()===tag){
                listener(target);
            }
            })
    }else{
        // 兼容IE
        element.attachEvent("on"+event,function(){
            var target = window.event.srcElement;
            if(target.nodeName.toLowerCase()===tag){
                listener(target);
            }
            })
    }
    
    
}
var ul = document.getElementById("ul");

delegateEvent(ul,"li","mouseover",function(target){
    target.style.backgroundColor = "red";
})

 

封装Js事件代理方法

标签:

原文地址:http://www.cnblogs.com/pssp/p/5281528.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!