javascript - 将事件监听器添加到索引元素

Question

我有一个元素列表。然而，该列表的长度因试验而异。例如，有时有 6 个元素，有时有 8 个。确切的数量在外部元数据中详细说明。

为了显示这个变量列表，我写了:

var html = '';
html += '<div id="button' + ind + '" class="buttons">';
html += '<p>' + name + '</p></div>';
display_element.innerHTML = html;

如果我要“检查”浏览器中的元素，它们的 ID 可能为 button0.buttons、button1.buttons等

现在我尝试将事件监听器附加到每个元素，但我的代码到目前为止还无法正常工作。下面是不同形式的损坏代码:

document.getElementById("button' + ind + '").addEventListener("click", foo);
$("#button' + ind + '").click(foo);

document.getElementById("button").addEventListener("click", foo);
$("#button").click(foo);

任何帮助将不胜感激!谢谢。

Answer 1

你错误地concat字符串将其更新为

document.getElementById("button" + ind).addEventListener("click", foo);

var html = '';
var ind = 1;
var display_element = document.getElementById("test");
html += '<div id="button' + ind + '" class="buttons">';
html += '<p>' + name + '</p></div>';
display_element.innerHTML = html;


document.getElementById("button" + ind).addEventListener("click", foo);

function foo(){
alert('click');
}

<div id="test"></div>