取消选中Bootstrap复选框按钮 - Pure JavaScript

我的应用程序中有数据过滤功能，用户可以使用复选框和下拉菜单选择他们想要如何过滤数据。取消选中Bootstrap复选框按钮 - Pure JavaScript

我使用的引导复选框：

<div class="btn-group" data-toggle="buttons"> 
<label class="btn btn-primary active"> 
    <input type="checkbox" autocomplete="off" checked> Checkbox 1 (pre-checked) 
</label> 
<label class="btn btn-primary"> 
    <input type="checkbox" autocomplete="off"> Checkbox 2 
</label> 
<label class="btn btn-primary"> 
    <input type="checkbox" autocomplete="off"> Checkbox 3 
</label> 
</div>

我有一个明确的过滤按钮，从而清除从过滤器的所有用户输入，重置所有复选框，所有的下拉菜单，所有的文本字段。

我能够重新下拉菜单是这样的：

// sectorPicker is drop down 
document.getElementById('sectorPicker').reset();

下面是我的复选框的图像：

但我找不出我们如何重置引导在屏幕上的复选框取消选中所有复选框。

有什么想法？

来源

2016-02-01 Skywalker

这会从它的父标签

$(":checkbox").prop('checked', false).parent().removeClass('active');

来源

2016-02-01 11:38:52

工作就像一个魅力！谢谢！ – Skywalker

试试这个，它会遍历所有选定的复选框，并使它们不被检查。或者你可以给每个复选框一个类attr，然后循环它。

 $("input:checked").each(function(){ 
      $(this).removeAttr("checked"); 
      $(this).parent().removeClass("btn btn-primary"); 
      $(this).parent().removeClass('active'); 
      $(this).parent().addClass("btn btn-default"); 
    });

//方式二：

<div class="btn-group" data-toggle="buttons"> 
<label class="btn btn-primary active"> 
    <input type="checkbox" class="mychk" autocomplete="off" checked> Checkbox 1 (pre-checked) 
</label> 
<label class="btn btn-primary"> 
    <input type="checkbox" class="mychk" autocomplete="off"> Checkbox 2 
</label> 
<label class="btn btn-primary"> 
    <input type="checkbox" class="mychk" autocomplete="off"> Checkbox 3 
</label> 
</div> 

$(".mychk").each(function(){ 
$(this).removeAttr("checked"); 
});

来源

2016-02-01 11:34:13 Mahesh

谢谢你的回答。我尝试过，但我的复选框仍然保持突出显示。如果你检查我的问题，我已经发布了一张图片。即使清除它们，您仍可以看到它们突出显示为蓝色。 – Skywalker

这是你的按钮类，你需要从标签元素中删除btn btn-primary类，看到我更新的答案 – Mahesh

欢呼队友！帮助很多+1 – Skywalker

$('#You_id_checkbox').removeAttr("checked");

来源

2016-02-01 11:35:12 lacexd

删除checked属性，也主动类据我所知引导复选框使用属性而不是属性。

$("[type='checkbox']").prop("checked", false)类似的东西应该工作。

来源

2016-02-01 11:39:17 mickiewicz

取消选中Bootstrap复选框按钮 - Pure JavaScript

回答

相关问题