首页 > 解决方案 > 如何从类似于选择的 div 中删除重复值

问题描述

我正在选择类别(使用复选框),然后根据类别获得子类别,如果我选择第一个类别获得 2 行(示例),如果我取消选择然后再次获得相同的行,是否有任何东西可以从 div 中删除重复项。

我正在使用 jQuery 的搜索功能,但没有得到正确的非重复值。

这是子类别详细信息将一一追加的地方

var expanded = false;

function showCheckboxes() {
  var checkboxes = document.getElementById("checkboxes");
  if (!expanded) {
    checkboxes.style.display = "block";
    expanded = true;
  } else {
    checkboxes.style.display = "none";
    expanded = false;
  }
}
$('.search-box').on("change", function(e) {

  var inputVal1 = $(this).val();
  var cars = ["Saab", "Volvo", "BMW"];
  var lclObj = JSON.parse(cars);
  for (var i = 0; i < lclObj.length; i++) {

    var lclSubCategory = lclObj[i];

    $('#checkboxes').append("<input type='checkbox' id='chkBox' value=" + lclSubCategory + ">" + lclSubCategory + "<br>");
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group search-box">
  <label>Category:</label>
  <select class="form-control">
    <option>1</option>
    <option>2</option>
    <option>3</option>
  </select>
</div>

<div class="multiselect col-sm-6">
  <label>Sub Category:</label>
  <div class="selectBox form-group" onclick="showCheckboxes()">
    <select class="form-control">
      <option value="">Select an option</option>
    </select>
    <div class="overSelect"></div>
  </div>
  <div id="checkboxes"></div>
</div>

标签: javascriptjquery

解决方案


您可以$('div').empty()在附加之前使用它。


推荐阅读