我的jQuery函数将元素推入所有数组

Question

在我的网站上，用户可以单击一些文本来打开模式。该模式允许用户选择一堆浇头添加到他们的披萨中。

通过Javascript，我将每个选定的浇头添加到数组中，并更改文本显示以匹配其选定的浇头。这或多或少有效，但是问题是由于某种原因，每当他们添加一个浇头时，它就会被添加到所有数组中，而不仅是为其选择的项。有人可以帮我找到原因吗？

  // Open Toppings Modal
$(document).ready(function() {
var count = -1
var tplist = []
 $(".order").each(function(){
  count += 1
  tplist.push([])
  var listeners = 0
  setModal(count, tplist, listeners)
});

function setModal(count, tplist, listeners) {
  $("#openModal" + count).click(function(){
    console.log("clicked")
    $("#toppingModal" + count).modal()
    if (listeners == 0) {
      listeners += 1
      $("input[type='checkbox']").change(function() {
        // TODO: Fix Bug
        // Adding to all javascript lists
        if (this.checked) {
          tplist[count].push($(this).val());
          console.log(tplist)
        }
        else {
          ele = $(this).val();
          pos = $.inArray(ele, tplist[count])

          if ( ~pos ) tplist[count].splice(pos, 1);
        }
        // Change text to list
        if (tplist[count].length > 0) {
          $("#openModal" + count).text(tplist[count])
        }
        else {
          $("#openModal" + count).text("Select Toppings")
        }
      })
    }
});
 };

});

Answer 1

我怀疑您的$（“ input [type ='checkbox']”）。change（function（）{}被每个模型调用。当您单击选择顶部并在$（“内部进行比较时，请尝试在某处设置计数编号。 input [type ='checkbox']“）。change（function（）{}以防止在所有数组中添加浇头