Question

我有HTML代码：

 <input type="checkbox" name="all" value="all">ALL
 <input type="checkbox" name="agent" value="agent" >Agent
 <input type="checkbox" name="company" value="company">Company
 <input type="checkbox" name="branch" value="branch">Branch

如果我检查所有，其他复选框将被禁用，如果取消选中，其他复选框将重新启用。

我尝试过这样做，使用下面的脚本。

$("input[name='all']").change(function() {
    if(this.checked) {
        $("input[name='agent']").prop("disabled",true);
    }
});

Answer 1

＆＃13;

//I have added a id field in your first check box and add a class rest of checkboxes.
//This code is working you can use this

$(function(){
  $('#all_employee').on('click',function(){
    if($(this).is(':checked') === true){
       $('.employee').prop('disabled','disabled');
    }else{      
      $('.employee').prop("disabled", false);
    }
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="checkbox" name="all" value="all" id="all_employee" >ALL
        <input type="checkbox" name="agent" value="agent" class="employee" >Agent
        <input type="checkbox" name="company" value="company" class="employee">Company
        <input type="checkbox" name="branch" value="branch" class="employee">Branch

＆＃13;

Answer 2

您的代码只会执行禁用操作。您应该使用checked值作为禁用属性来根据检查/取消选中状态切换状态：

＆＃13;

 var subinputs = $("input[name=agent],input[name=company],input[name=branch]");
$("input[name='all']").change(function() {
   subinputs.prop("disabled",this.checked);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="all" value="all">ALL
        <input type="checkbox" name="agent" value="agent" >Agent
        <input type="checkbox" name="company" value="company">Company
        <input type="checkbox" name="branch" value="branch">Branch

＆＃13;

Answer 3

添加其他人：

    $("input[name='all']").change(function() {
if(this.checked) {
            $("input[name='all'] input").prop("disabled",true);
}
else{
        $("input[name='all'] input").prop("disabled",false);
}});

Answer 4

绑定更改处理程序，然后取消选中所有复选框，除了选中的复选框：

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

jQuery if复选框被选中diasble其他复选框

4 个答案: