根据条件禁用复选框

时间:2015-01-08 08:08:38

标签: javascript jquery checkbox

我有3个复选框,说复选框A,复选框B,复选框C.我有一个类似

的要求
  1. 如果选中复选框A,则应禁用复选框B和C.
  2. 我可以同时检查复选框B和C,在这种情况下,应禁用复选框A.
  3. 单独选中复选框B或复选框C(单选)时,在任何一种情况下,都应禁用复选框A.
  4. 以下是我的代码:

    $("#B").change(function(){
        if($("#B").is(':checked'))
        {
          $("#A").attr("disabled", true);
        }
        else
        {
          $("#A").attr("disabled", false);
          $("#B").attr("disabled", false);
          $("#C").attr("disabled", false);
        }
      });
    
      $("#C").change(function(){
        if($("#C").is(':checked'))
        {
          $("#A").attr("disabled", true);
        }
        else
        {
          $("#A").attr("disabled", false);
          $("#B").attr("disabled", false);
          $("#C").attr("disabled", false);
        }
      });
    
      $("#A").change(function(){
        if($("#A").is(':checked'))
        {
          $("#B").attr("disabled", true);
          $("#C").attr("disabled", true);
        }
        else
        {
          $("#A").attr("disabled", false);
          $("#B").attr("disabled", false);
          $("#C").attr("disabled", false);
        }
      });
    

    任何人都可以帮助我这个

1 个答案:

答案 0 :(得分:1)

您需要更新条件:JSFIDDLE

$("#B").change(function () {
    if ($("#B").is(':checked')) {
        $("#A").attr("disabled", true);
    } else {
        if ($("#C").is(':checked')) {
            $("#A").attr("disabled", true);
        } else {
            $("#A").attr("disabled", false);
            $("#B").attr("disabled", false);
            $("#C").attr("disabled", false);
        }
    }
});

$("#C").change(function () {
    if ($("#C").is(':checked')) {
        $("#A").attr("disabled", true);
    } else {
        if ($("#B").is(':checked')) {
            $("#A").attr("disabled", true);
        } else {
            $("#A").attr("disabled", false);
            $("#B").attr("disabled", false);
            $("#C").attr("disabled", false);
        }
    }
});

$("#A").change(function () {
    if ($("#A").is(':checked')) {
        $("#B").attr("disabled", true);
        $("#C").attr("disabled", true);
    } else {
        $("#A").attr("disabled", false);
        $("#B").attr("disabled", false);
        $("#C").attr("disabled", false);
    }
});