JQuery 点击时 .prop() 选中 > 错误

Question

我有一个带有复选框的表单，它会生成一个新块，显示用户选择的滤色器。

Form

在这个新块中，我创建了一个点击事件，它使用“.buttonRemoveFilter”按钮删除了选定的过滤器。

我尝试取消选中与过滤器相关的复选框，但我只能取消选中所有复选框。

$(document).on("click", ".buttonRemoveFilter", function(){

     $("[id^=branche_search_form_couleurs_").prop("checked", false);
     $(this).parent().parent().remove();
});

我尝试这样做，当我从新块中删除过滤器时，它会取消选中与该过滤器相关的颜色复选框。

New block

<div class="poPupFiltre">
  <div class="sousBlockPoPup">
    <button class="buttonRemoveFilter">
      <img class="img-fluid imgPoPup" src="{{ asset ('../build/images/supprimer.svg') }}" alt="">
    </button>
    <p class="textPopUp"></p>
  </div>
</div>

Answer 1

试试这些选项。

在您的表单中添加一个常用的 class 到您的输入复选框（假设 class 名称是“.chxbox”）

然后使用这个jQuery函数

   $('.chxbox').click(function(){
         id = $(this).attr('id');
         $(id).prop('checked',false);
         $(this).remove();
    });

Answer 2

添加一种了解您单击了哪个过滤器的方法 - 如果您要删除 BLANC 过滤器，请检查用户是否单击了 BLANC 过滤器类型。然后使用

访问复选框输入

$("input[value='"+clickedFilterType+"']")

像这样：

$(document).on("click", ".buttonRemoveFilter", function(){
     let clickedFilterType = $(this).attr("data-type");
     $("input[value='"+clickedFilterType+"']").prop("checked", false);

});

JQuery 点击时 .prop() 选中 > 错误

JQuery .prop() on click checked > false

jquery

click

checked

prop