事件偵聽器不適用於某些 HTML 元素

Question

我有 2 組 HTML 按鈕，全部帶有 class btn 。

 const btn = document.querySelectorAll('.btn'); const btnArray = Array.from(btn); btnArray.forEach((item) => { item.addEventListener('click', () => { console.log('clicked'); console.log(item.value) }); });

 <div class="calculator"> <div class="display"> <p class="output">YES</p> </div> <div class="operations"> <input type="submit" class="btn add" value='+'> <input type="submit" class="btn subtract" value='-'> <input type="submit" class="btn multiply" value='x'> <input type="submit" class="btn divide" value=&divide;> <input type="submit" class="btn clear" value='CLEAR'> </div> <div class="calcBody"> <input type="submit" class="btn seven" value='7'> <input type="submit" class="btn eight" value='8'> <input type="submit" class="btn nine" value='9'> <input type="submit" class="btn four" value='4'> <input type="submit" class="btn five" value='5'> <input type="submit" class="btn six" value='6'> <input type="submit" class="btn one" value='1'> <input type="submit" class="btn two" value='2'> <input type="submit" class="btn three" value='3'> <input type="submit" class="btn zero" value='0'> <input type="submit" class="btn period" value='.'> <input type="submit" class="btn off" value='ON/OFF'> </div> </div>

這僅適用於calcBody div 中的按鈕，而不適用於operations div 中的按鈕。 然而，當我console.log(btnArray)它顯示所有按鈕（這很奇怪）。

有人能告訴我為什么嗎？ 謝謝。

Answer 1

完美運行。 我在谷歌瀏覽器上檢查過。