Question

我有一个带有动态生成按钮的页面，我试图使用for循环向它们添加事件监听器。我不确定为什么我的代码不起作用，因为它通过它的ID引用每个按钮并使用点符号来添加事件监听器。代码中有一些评论可以帮助澄清。

这是缩略标记，仅显示按钮

<button class="btnRollDice" id="btnRollDiceP1">Roll Dice!</button>
<button class="btnRollDice" id="btnRollDiceP2">Roll Dice!</button>
<button class="btnRollDice" id="btnRollDiceP3">Roll Dice!</button>

这是js

rollDiceBtns = document.getElementsByClassName('btnRollDice');//returns a HTML collection

function addEventListeners(){
    console.log(rollDiceBtns);
    for(i=0;i<rollDiceBtns.length;i++){
        console.log(rollDiceBtns[i].id); //THIS WORKS, 
        rollDiceBtns[i].id.addEventListener('click', rollDice, false); //THIS DOES NOT
    }
}

如何使用for循环完成此操作？动态生成按钮？

Answer 1

addEventListener是您在元素上找到的方法。

rollDiceBtns[i]是一个元素。

rollDiceBtns[i].id是一个字符串。

删除.id。

如何使用for循环将事件侦听器添加到动态生成的按钮

1 个答案: