Question

我尝试做的是添加元素，并在其上写上一些文字，当我点击它们时，我希望该文字显示为alert。

（arr是一个字符串数组）

for (var i=0; i<arr.length; i++) {

        var node = document.createElement("p");
        var textNode = document.createTextNode(arr[i]);
        node.appendChild(textNode);

        //Add click event listener
        node.addEventListener("click", function () {
            alert(arr[i]);
        });

        //add node to list div section
         document.getElementById("list").appendChild(node);
    }
}

这不能正常工作所有节点都响应警报参数undefined的点击。我理解它是因为arr在调用函数时不再存在。

我该如何解决这个问题？

Answer 1

你用jQuery标记了这个，所以这是一个jQuery解决方案;在父元素上使用委托事件，该元素将附加创建的元素。试试这个：

$('#list').on('click', 'p', (function() {
    alert($(this).text());
});

for (var i = 0; i < arr.length; i++) {
    $('<p />', { text: arr[i] }).appendTo('#list');
}

如何将局部变量作为参数发送到响应为EventListener（JavaScript）的函数？

1 个答案: