확인란을 비활성화하십시오.

Question

내 코드 에서처럼 클릭 할 때 확인란의 선택을 해제하고 싶습니다. 사용자가 확인란 A를 클릭하면 확인란 B 및 C가 비활성화되어야하지만 사용자가 확인란 B 또는 C를 클릭하면 A 만 비활성화됩니다. 사용자는 B와 C를 다중 선택 할 수 있습니다. 모든 경우에 단일 선택이어야합니다.

<input type="checkbox" name="vehicle" value="Bike" class="a"> A 
<input type="checkbox" name="vehicle" value="Car" class="b"> B 
<input type="checkbox" name="vehicle" value="Bike" class="c"> C 

Answer 1

당신의 HTML을 수정 후 :

<input type="checkbox" name="vehicle" value="Bike" class="a"> A 
<input type="checkbox" name="vehicle" value="Car" class="b"> B 
<input type="checkbox" name="vehicle" value="Bike" class="c"> C 

당신은 같은 것을 할 수있는 :

$("input").click(function(){ 
     var _class=$(this).attr('class'); 
     if($(this).is(':checked')){ 
      if(_class=='a'){ 
        $('.b').attr('disabled','disabled'); 
        $('.c').attr('disabled','disabled'); 
      }else if(_class=='b' || _class=='c'){ 
       $('.a').attr('disabled','disabled'); 
      } 
     }else{ 
      if($("input:checked").length==0){ 
       $("input").removeAttr('disabled'); 
      } 
     } 
    }); 

Answer 2

죄송를 완전히 질문을 읽고에만 A는 경우를 사용하지 않도록 놓친하지 않았다 B 또는 C가 확인되었습니다. 여기에 (비활성화 입력에 대한 라벨 색상을 변경하는 데 사용) 내 추가 된 스팬을 포함, 작업 버전입니다 :

$(document).ready(function() { 
    $('input').change(function(){ 
     if ($(this).is(':checked') && $(this).hasClass('a')) { 
      $('input').not('.a').attr('disabled', true); 
      $('input').not('.a').next('span').css('color', '#888888'); 
     } else if ($('.b').is(':checked') || $('.c').is(':checked')) { 
      $('.a').attr('disabled', true); 
      $('.a').next('span').css('color', '#888888'); 
      $('input').not('.a').attr('disabled', false); 
     } else { 
      $('input').attr('disabled', false); 
      ('span').css('color', ''); 
     } 
    }); 
}); 

바이올린 : http://jsfiddle.net/nfcTE/2/