从Javascript的元素列表中检查哪个元素导致了事件

Question

我有一个带有事件监听器的元素列表，如下所示：

var h1 = document.getElementById("h1"),
    h2 = document.getElementById("h2"),
    h3 = document.getElementById("h3");

var elemArray = [h1,h2,h3];

for(var i=0;i<elemArray.length;i++){
    elemArray[i].addEventListener("click",mouseListener,false);
}

function mouseListener(e){
    // code goes here
    // whenever it's called i want to know from
    // which element it's been called
}

现在我想要的是每当我单击其中一个元素时，
我想知道在没有为每个元素使用不同功能的情况下单击了哪个。

Answer 1

只需在回调中使用this变量，它将指向目标元素：

function mouseListener(e) {
    console.log( this.id );
}

Answer 2

function mouseListener(e){
     var elementEventWasSet = this;
     var clickedEl = e.target; // in case of bubbling, this is the one that was clicked
    // code goes here
    // whenever it's called i want to know from
    // which element it's been called
}

Answer 3

你可以做这样的事情

function mouseListener(e){
    if(this === h1){
        console.log("First was pressed");
    }else if(this === h2){
        console.log("Second was pressed");
    }else if(this === h3){
        console.log("Third was pressed");
    }
}

仅当h1，h2和h3是全局变量时，这才有效。 您可以在以下站点上看到这种方法的实际效果： http : //jsfiddle.net/94xMu/2/