如何在同一循环中通过Id定位循环元素?

时间:2012-06-07 09:32:29

标签: javascript javascript-events

这就是我要做的事情:

var numArray = ["One","Two","Three","For","Five","Six"];

for (i = 0, i < numArray.length; i++) {
   document.getElementById('results').innerHTML += <div id='listResult_"+[i]+"'></div><br>;

   var target = document.getElementById('listResult_'+[i]);
   document.addDomListener(target, 'mouseover', function() {
      alert("listResult_"+[i]);
   });
}

它仅警告最后一个目标Id(listResult_5)。 我怎样才能单独定位所有六个?

2 个答案:

答案 0 :(得分:1)

尝试:

for (i = 0, i < numArray.length; i++) {
   document.getElementById('results').innerHTML += "<div id='listResult_"+[i]+"'></div><br>";

   var target = document.getElementById('listResult_'+[i]);    

    (function(e) {
       document.addDomListener(target, 'mouseover', function() {
         alert("listResult_"+[e]);
       });
    })(i);
}

答案 1 :(得分:0)

每当您向innerHTML分配任何内容时,销毁已存在的元素。由于您使用的是+=,因此您创建了新元素...但是您附加到它们的事件处理程序已丢失。改为使用标准DOM方法创建和追加元素。

此外,i是一个变量。它将是循环结束时分配的最后一个值。

从上下文中获取数据。

您的for循环语法也不正确。

addDomListener似乎是Google地图功能。将addEventListener用于HTML。

var numArray = ["One","Two","Three","For","Five","Six"];

for (var i = 0; i < numArray.length; i++) {
   var myDiv = document.createElement('div');
   myDiv.id = "listResult_"+[i];
   myDiv.appendChild(document.createTextNode(myDiv.id));
   document.getElementById('results').appendChild(myDiv);
   // Don't append a line break between block containers. Use CSS isntead.
   myDiv.addEventListener('mouseover', function() {
      alert(this.id);
   });
}​