function initNumberElement(){
let idReference = ['zero','one','two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine'];
let numberElementReference = [];
let temp = '0';
for (const key of idReference) {
numberElementReference.push(document.getElementById(key));
for (let i = 0; i < numberElementReference.length; i ) {
numberElementReference[i].addEventListener('click', () => {
temp = temp String(i);
changeVisualOut(temp)
})
}
}
return numberElementReference;
}
從 Dom 中檢索元素后，我嘗試使用 forEach () 為每個元素動態插入 addEventListener () 但每次單擊元素時，都會多次觸發該事件。為什么？
即使使用 for 回圈，動態也保持不變
uj5u.com熱心網友回復：
你根本不需要第二個回圈。在第一個回圈中，您將遍歷 id 串列并將元素添加到numberElementReference陣列中。然后對于numberElementReference陣列中的所有元素，您正在添加單擊處理程式，這就是為什么每個元素有多個偵聽器的原因（因為對于外回圈中的每個專案，您再次為整個numberElementReference陣列注冊事件偵聽器）
您可以只使用一個回圈：
function initNumberElement() {
let idReference = ["zero", "one", "two", "three", "four", "five", "six", "seven", "eight", "nine"];
let numberElementReference = [];
let temp = "0";
for (let i = 0; i < idReference.length; i ) {
const id = idReference[i];
const element = document.getElementById(id);
numberElementReference.push(element);
element.addEventListener("click", () => {
temp = temp String(i);
changeVisualOut(temp);
});
}
return numberElementReference;
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/351541.html
標籤：javascript 循环 dom 事件 foreach
上一篇：C程式在嵌套回圈期間自行結束