javascript - 如何设置全局单击监听器以从多个按钮获取值？

Question

我有一个按钮数组，每个按钮都有不同的值。 我需要添加一个事件监听器来监听何时单击它。 单击的按钮的值将被推送到不同的数组中。

我觉得我需要 forEach，但不太适合它。

function placeBet() {
  var betBtn_nodelist = document.querySelectorAll('.bet_amount > button');
  var betButtonsArr = Array.prototype.slice.call(betBtn_nodelist);

  for (var i = 0; i < betButtonsArr.length; i++) {
    betButtonsArr[i];
  }
}

<div class="bet_amount">
  <button class="five" value="5">5</button>
  <button class="ten" value="10">10</button>
  <button class="fifty" value="50">50</button>
  <button class="hundred" value="100">100</button>
</div>

Answer 1

您必须为数组中的每个元素附加一个click事件处理程序。

result = [];
function placeBet(){
    var betBtn_nodelist = document.querySelectorAll('.bet_amount > button');
    var betButtonsArr = Array.prototype.slice.call(betBtn_nodelist);
    for (let i = 0; i < betButtonsArr.length; i++) {
       betButtonsArr[i].onclick = function(){
         result.push(this.value);
         console.log(result);
       }
    }
}
placeBet();

<div class="bet_amount">
    <button class="five" value="5">5</button>
    <button class="ten" value="10">10</button>
    <button class="fifty" value="50">50</button>
    <button class="hundred" value="100">100</button>
</div>