如何使用for循環將事件監聽器添加到動態生成的按鈕

Question

我有一個頁面w /動態生成的按鈕，我試圖使用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。