Javascript 事件侦听器未在循环中工作

我在

addEventListener（）函数中遇到了问题。我正试图基于数组中的变量构建一个菜单（我不想解释为什么会这样设置）

代码如下：

var _Dirt = document.getElementById("dirt");

_Dirt.addEventListener('mouseover', function () { menuOver(true, this, _dirtY); }, false);
_Dirt.addEventListener('mouseout', function () { menuOver(false, this, _dirtY); }, true);

var _DirtDiv = _Dirt.getElementsByTagName('div')[0];

for (nLink in Men["dirt"]) {

    var _lnk = document.createElement('p');
    _lnk.className = 'menu';
    _lnk.innerHTML = Men["dirt"][nLink][0];
    _lnk.addEventListener('click', menuLoop(Men["dirt"][nLink][1]), false);

    _DirtDiv.appendChild(_lnk);
    _DirtDiv.innerHTML+= '<br />';

}

现在，令人恼火的部分是事件侦听器在
\u Dirt
元素上工作正常，但在
\u lnk
元素上根本没有工作。即使我将其更改为
\u lnk.onclick=function（）{//something}
，它也不会工作（事实上，
onclick
属性甚至不会显示在DOM中）

我有另一个循环函数，它也将事件监听器附加到元素，这个函数工作得非常好……代码非常类似。更令人沮丧的是，这段代码过去工作得非常完美。实际上，我甚至不记得对这段代码做过任何更改。我试图在代码中隔离此函数，以查看脚本中是否有断点，但问题仍然存在

如果您需要我的代码的任何其他部分，请告诉我。
（假设您的数据结构都是正确的）

你的问题是

_DirtDiv.innerHTML += '<br />';


Chrome控制台中的示例演示了节点的不同：

> var node = document.createElement('div');
  undefined
> node.id = 'foo'; 
  "foo"
> document.body.appendChild(node);
  <div id=​"foo">​</div>​
> node === document.getElementById('foo');
  true                                       // nodes are the same
> document.body.innerHTML += '<br />';
  "... long HTML string ..."
> node === document.getElementById('foo');
  false                                      // nodes are different

var节点=document.createElement（'div'）；
未定义
>node.id='foo'；
“福”
>document.body.appendChild（节点）；
​​
>node==document.getElementById（'foo'）；
true//节点是相同的
>document.body.innerHTML+='
'；
“…长HTML字符串…”
>node==document.getElementById（'foo'）；
false//节点不同

（假设您的数据结构都是正确的）

你的问题是

_DirtDiv.innerHTML += '<br />';

---

Chrome控制台中的示例演示了节点的不同：

> var node = document.createElement('div');
  undefined
> node.id = 'foo'; 
  "foo"
> document.body.appendChild(node);
  <div id=​"foo">​</div>​
> node === document.getElementById('foo');
  true                                       // nodes are the same
> document.body.innerHTML += '<br />';
  "... long HTML string ..."
> node === document.getElementById('foo');
  false                                      // nodes are different

var节点=document.createElement（'div'）； 未定义 >node.id='foo'； “福” >document.body.appendChild（节点）； ​​ >node==document.getElementById（'foo'）； true//节点是相同的 >document.body.innerHTML+='
'； “…长HTML字符串…” >node==document.getElementById（'foo'）； false//节点不同

---

您是否尝试过只传递一个硬编码的

函数（）{alert（'boom！'）；}

而不是

menuLoop（Men[“dirt”][nLink][1]）

来确保事件处理程序触发？“

onclick

属性甚至不会显示”这是因为您没有添加属性。您正在直接使用DOM及其事件系统。@Yaniro:是的，我已经试过了。没用。我不是：我在添加onclick事件时指的是。我知道在添加事件侦听器时，它不会显示在DOM中。请尝试将_lnk元素的addEventListener的第二个参数更改为

function（）{menuLoop（Men[“dirt”][nLink][1]）}

就像您对_dirt元素所做的那样。@Coder:没有用。我认为Felix Kling是对的，这是DOM分配的一个问题。您是否尝试过传递一个硬编码的

函数（）{alert（'boom！'）；}

而不是

menuLoop（Men[“dirty”][nLink][1]）

来确保事件发生？

onclick

属性甚至不会显示出来这是因为您没有添加属性。您正在直接使用DOM及其事件系统。@Yaniro:是的，我已经试过了。没用。我不是：我在添加onclick事件时指的是。我知道在添加事件侦听器时，它不会显示在DOM中。请尝试将_lnk元素的addEventListener的第二个参数更改为

function（）{menuLoop（Men[“dirt”][nLink][1]）}

就像您对_dirt元素所做的那样。@Coder:没有用。我认为Felix Kling是对的，这是DOM分配的一个问题。+1非常好的捕获。如果需要换行符，应该通过DOM插入而不是innerHTML修改来添加。这是一个代码格式问题。问题中的

在SO页面中被解释为HTML。啊，我明白了。。。没有注意到

innerHTML

使用的上下文。他正在摧毁旧的DOM+1另一个不应该这样做的例子

elem.innerHTML+=…

@Felix Kling:就是这样！虽然我不知道为什么它以前能起作用，但我想我现在真的不在乎了。非常感谢+1个精彩的接球。如果需要换行符，应该通过DOM插入而不是innerHTML修改来添加。这是一个代码格式问题。问题中的

在SO页面中被解释为HTML。啊，我明白了。。。没有注意到

innerHTML

使用的上下文。他正在摧毁旧的DOM+1另一个不应该这样做的例子

elem.innerHTML+=…

@Felix Kling:就是这样！虽然我不知道为什么它以前能起作用，但我想我现在真的不在乎了。非常感谢！