0

我正在尝试创建一个列表，以便在单击 LI 元素时显示特定的 div。我想从字典中读取 div 的 id 和其他属性。所以，字典看起来像这样：

var ifSrc = {"welcome":"welcome.html",
          "proceduresAndComputers":"../proceduresAndComputers/index.html",
          "someId":"../someSourceFileForAnIFrame"}

以及形成这些 LI 元素的功能

function createMenu(){
    var listy = document.getElementById("sidebar");
    for(var key in ifSrc){
        var elem = document.createElement('li');
        elem.innerHTML = key;
        elem.className = "unselected";
        elem.addEventListener("click",function(){openDiv(this,key);},false);
        listy.appendChild(elem);
    }
    listy.firstElementChild.className="selected";
}

因此，菜单（带有 LI 元素的 UL）看起来不错，但无论我单击哪个 LI，openDiv 函数都会传递正确的值this，但传递相同的值key。特别是，它传递字典key中的最后一个值。ifSrc但是，每个 elem（设置为key）的 innerHTML 看起来都很好。我检查了 addEventListener 的文档，但找不到太多。

为什么会这样？有什么见解吗？

4

1 回答 1

0

只需确保您正在捕获正确的键值（在下面的示例中使用闭包）。您现在拥有它的方式key始终是对所有点击事件中相同值的引用。您可以通过执行以下操作复制每个点击事件的当前值：key

    elem.addEventListener("click", (function(k) {
        return function() { 
            openDiv(this, k);
        }
    })(key), false);

演示 - jsfiddle.net

供参考——查看此处解释的“臭名昭著的循环问题” 。

于 2013-08-23T17:47:04.420 回答