使用javascript将复选框值推入数组

Question

我有一堆复选框，每个复选框的价值是不同的价格。我创建了一个对象，如果选中该框，则该对象包含将值推入数组的函数。当我控制日志空数组时，它显示为空，所以我知道它有效。我只是无法通过其中的推送值来控制日志。

<input type="checkbox" id="bac" value ="1">bacon - $1


var allIngredients = {

 ingredientArray: [],
 baconBox: function() {
  var bacon = document.getElementById('bac');
  if (bacon.checked === true) {
    this.ingredientArray.push(bacon.value);
  }
},

编辑：

 console.log(allIngredients.ingredientArray); 

返回一个像这样的空数组＆＃34; []＆＃34;。我不能让它像这样返回一个带有培根值的数组＆＃34; [1]＆＃34;当我勾选方框时。培根的价值是1.

Answer 1

正如其他人在评论中指出的那样，你应该调用函数allIngredients.baconBox()。

一个选项是添加一个事件监听器，如下所示：

document.getElementById('bac').addEventListener('change', function() {
  allIngredients.baconBox();
});

虽然此方法的缺点是取消选中此框不会从bacon.value数组中删除allIngredients。