javascript - 从动态数组中删除项目

Question

我有一些用作过滤器的列表和复选框，我需要做的是，当您选择一个复选框时，将该值添加到标题旁边的一个小标签中，当取消选中时，然后删除该值。

我正在做这项工作，将每个值保存到一个数组中，当取消选中时，尝试查找该值的索引并删除，但我认为我与数组中的位置有冲突。如果您逐个单击然后逐个删除，那么它会起作用，但如果您单击所有这些并仅取消选中第一个，则会删除所有内容。知道如何解决该问题，但不确定如何继续。

请问有什么帮助吗？ https://jsfiddle.net/panconjugo/qsgwvp63/2/

$(function() {
  $(".filter-nav > li").each(function(index) {
    var brands = [];
    $(this).find("input:checkbox").each(function(index) {
      $(this).on("click", function() {
        if ($(this).is(":checked")) {
          console.log("adding: " + index);
          brands.push($(this).val());
          console.log(brands);
          $(this).parent().parent().prev().find(".selected-group").text(brands.join(", "));
        } else {
          console.log("removing:" + index);
          brands.splice(index);
          console.log(brands);
          $(this).parent().parent().prev().find(".selected-group").text(brands.join(", "));
        }
      });
    });
  });
});

Answer 1

将代码 brands.splice(index); 更改为 brands.splice(brands.indexOf($(this).val()), 1);

首先您必须从数组中找到项目索引，然后使用该索引从数组中删除