jQuery:取消选中已选中的其他复选框

我总共有6个复选框(以后可能会添加更多),并且我只允许选择一个,因此当用户选中其中任何一个时,都应取消选中该复选框。

我尝试使用此代码,并且在定义ID的情况下也可以正常工作,但是现在我只是想知道如何以有效的方式使其反之亦然,所以在将来,如果我添加的数量超过该数量,那将不是问题

$('#type1').click(function() {
     $('#type2').not('#type1').removeAttr('checked');
}); 

仅供参考,复选框不是同级的,并且处于不同的状态<td>

Code Lover asked 2019-11-15T21:47:21Z
6个解决方案
151 votes

绑定一个change处理程序,然后取消选中所有复选框,除了选中的复选框之外:

$('input.example').on('change', function() {
    $('input.example').not(this).prop('checked', false);  
});

这是一个小提琴

billyonecan answered 2019-11-15T21:47:48Z
15 votes

您可以将class用于所有复选框,并执行以下操作:

$(".check_class").click(function() {
  $(".check_class").attr("checked", false); //uncheck all checkboxes
  $(this).attr("checked", true);  //check the clicked one
});
Sudhir Bastakoti answered 2019-11-15T21:48:12Z
2 votes

试试这个

 $(function() { 
  $('input[type="checkbox"]').bind('click',function() {
    $('input[type="checkbox"]').not(this).prop("checked", false);
  });
});
Amit answered 2019-11-15T21:48:31Z
1 votes

试试这个

$("[id*='type']").click(
function () {
var isCheckboxChecked = this.checked;
$("[id*='type']").attr('checked', false);
this.checked = isCheckboxChecked;
});

为了使其更加通用,您还可以通过在其上实现的通用类找到复选框。

改性...

Abhishek Jain answered 2019-11-15T21:49:02Z
1 votes
$('.cw2').change(function () {
    if ($('input.cw2').filter(':checked').length >= 1) {
        $('input.cw2').not(this).prop('checked', false);
    } 
});


$('td, input').prop(function (){
    $(this).css({ 'background-color': '#DFD8D1' });
    $(this).addClass('changed');
});
rogieo answered 2019-11-15T21:49:20Z
0 votes

我认为prop方法在使用boolean属性时更为方便。[http://api.jquery.com/prop/]

nubinub answered 2019-11-15T21:49:44Z
translate from https://stackoverflow.com:/questions/17785010/jquery-uncheck-other-checkbox-on-one-checked