Question

我让下一个代码正常工作：

var links = document.getElementsByClassName('register');
for(var index = 0; index < links.length; ++index)
{
   links[index].addEventListener('click', function(){
       var newMixpanelEvent = 'mixpanel.track("Click On Searched List", {"user is logged": "no"})';
       trackEvent(newMixpanelEvent);
       });
}

这只是侦听单击事件，然后执行一个函数来为Mixpanel创建一个事件。

现在我需要检查addEventListener函数和attachEvent以使其几乎适用于所有浏览器，所以我这样做：

var links = document.getElementsByClassName('register');
for(var index = 0; index < links.length; ++index)
{
   if( links[index].addEventListener ) {
       links[index].addEventListener('click', function(){
           var newMixpanelEvent = 'mixpanel.track("Click On Searched List", {"user is logged": "no"})';
           trackEvent(newMixpanelEvent);
           });        
   } else if( links[index].attachEvent ) {
       links[index].attachEvent('onclick', function(){
           var newMixpanelEvent = 'mixpanel.track("Click On Searched List", {"user is logged": "no"})';
           trackEvent(newMixpanelEvent);
           });
   }
}

但这不是解雇事件。好像if( links[index].addEventListener )似乎没有通过。知道为什么吗？

Answer 1

好吧，上面的代码工作正常。问题是我没有清除缓存。这就是我之前的工作，并没有起作用：

if( window.addEventListener ) { 
    ...

但是

if( links[index].addEventListener ) {
    ...

工作正常。

Answer 2

作为最终后备，您可以通过onclick属性添加事件。您应该使用逻辑定义sperate函数，以检查附加事件处理程序的可用方法。

function addCrossBrowserEvent(element, eventName, callback){
    if(element.addEventListener){
        element.addEventListener(eventName, callback);
    }
    else if(element.attachEvent){
        element.attachEvent('on' + eventName, callback);
    }
    else{
        element['on' + eventName] = callback;
    }
}

用法：

addCrossBrowserEvent(myElement, 'click', function() { 
    alert('clicked'); 
});

注意：您也可以尝试将其设计为HTMLElement原型的扩展。

HTMLElement.prototype.addCrossBrowserEvent = function(eventName, callback) {
    if(this.addEventListener){
        this.addEventListener(eventName, callback);
    }
    else if(this.attachEvent){
        this.attachEvent('on' + eventName, callback);
    }
    else{
        this['on' + eventName] = callback;
    }
}

// Usage
document.getElementById('elementId').addCrossBrowserEvent('click', function() { 
    // ... 
});

跨浏览器Javascript侦听器

2 个答案: