javascript delegate函数

最新推荐文章于 2024-01-26 16:49:56 发布

weixin_30408309

最新推荐文章于 2024-01-26 16:49:56 发布

阅读量149

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/bluedream2009/archive/2010/08/23/1806865.html

本文介绍了一种使用委托方式处理页面上带有特定ID前缀元素点击事件的方法。通过自定义的delegateEvent函数实现，该函数能够遍历DOM节点并检查是否符合预设条件，一旦匹配则触发相应的事件处理器。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

// Usage:
// Target all links with an ID starting with "notice"
delegateEvent({nodeName:/^a$/i, id: /^notice/}, 'click', function(){
    alert(this.id);
});


function delegateEvent(props, type, handler) {
    
    var fn = function(e) {
        
            e = e || window.event;
            
            var target = e.target || e.srcElement,
                parent = target,
                p, prop, matches = false;
            
            do {
                
                matches = false;
                
                for (p in props) {
                    if (!props.hasOwnProperty || props.hasOwnProperty(p)) {
                        prop = props[p];
                        matches = prop.test ? prop.test(parent[p]) : prop === parent[p];
                    }
                }
                
                if (matches) {
                    return handler.call( parent, e );
                }
                
            } while ( parent = parent.parentNode );
            
            return true;
        
        },
        doc = document;
    
    if (doc.addEventListener) {
        
        doc.addEventListener( type, fn, false );
        
    } else {
        
        if (doc.attachEvent) {
            doc.attachEvent( 'on' + type, fn );
        } else {
            var origHandler = doc['on' + type];
            doc['on' + type] = function(e) {
                origHandler.call(this, e);
                fn(e);
            };
        }
        
    }
    
}

转载于:https://www.cnblogs.com/bluedream2009/archive/2010/08/23/1806865.html