확인란을 선택한 경우 드롭 다운 사용 안함 ... 드롭 다운이 활성화되지 않음

Question

확인란을 선택하면 드롭 다운을 사용하려고합니다. 하지만 그렇게 할 때 ... 작동하지 않았습니다. Pls 여기 좀 도와주세요. HTML :

   <label class="checkbox-inline"> 
       <input type="checkbox" value="" id="onstage">On Stage 
       </label> 


         <div class="col-md-9"> 
         <select name="occupation" id="occupation" multiple="multiple" disabled="disabled"> 
         <option value="Actor">Actor</option> 
         <option value="Supervisor">Supervisor</option> 
         <option value="Extra">Extra</option> 
        </select> 

JQuery와 :

<script type="text/javascript"> 
$(function(){ 

      $("#onstage").click(function(){ 

       if($(this).is(":checked")){ 
        $("#occupation").removeAttr("disabled"); 
        $("#occupation").focus(); 
       } else { 
        $("#occupation").attr("disabled", "disabled"); 
       } 
      }); 
     }); 
    </script> 

Answer 1

를 사용하면 다음 코드가 작동해야한다 JQuery와 3.2.1를 사용하는 경우.

확인 한 번

1) 당신은 JS 다른 코드 (오류에 대한 콘솔을 확인)

2) 고유해야합니다 확인 ID를 확인에서 오류가없는 그래서 당신은 onstage 및 occupation 한 번만 있어야합니다 문서의

$(function(){ 
 

 
      $("#onstage").click(function(){ 
 

 
       if($(this).is(":checked")){ 
 
        $("#occupation").removeAttr("disabled"); 
 
        $("#occupation").focus(); 
 
       } else { 
 
        $("#occupation").attr("disabled", "disabled"); 
 
       } 
 
      }); 
 
     });

<label class="checkbox-inline"> 
 
    <input type="checkbox" value="" id="onstage">On Stage 
 
</label> 
 

 

 
<div class="col-md-9"> 
 
<select name="occupation" id="occupation" multiple="multiple" disabled="disabled"> 
 
    <option value="Actor">Actor</option> 
 
    <option value="Supervisor">Supervisor</option> 
 
    <option value="Extra">Extra</option> 
 
</select> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

편집 당신이 bootstrap multiselect 그래서 당신이 사용하고 multiselect이 같은 코드를 chcgae 속성을 해제 할 필요가 사용하는 귀하의 의견에 따라 :.

$("#onstage").click(function(){ 
if($(this).is(":checked")){ 
     $("#occupation").multiselect('enable');      
} else { 
     $("#occupation").multiselect('disable'); 
} 
}); 

Answer 2

당신은 disabled 재산, if you're using jQuery 1.6+을 설정 prop 대신 attr을 사용해야합니다. 또한이 같은 코드를 단순화 할 수 있습니다 :

$("#onstage").change(function(){ 
    $("#occupation").prop("disabled", !$(this).is(":checked")); 

    if($(this).is(":checked")){ 
     $("#occupation").focus(); 
    } 
}); 

Answer 3

사용 $ ("# 직업") ATTR ("장애인" "진실 "); 당신의 선택을 취소 확인란의 시간에 선택된 값을 제거 할 경우 다른 블록에

<script type="text/javascript"> 
$(function(){ 

      $("#onstage").click(function(){debugger; 

       if($(this).is(":checked")){ 
        $("#occupation").removeAttr("disabled"); 
        $("#occupation").focus(); 
       } else { 
        $("#occupation").attr("disabled", "true"); 
       } 
      }); 
     }); 
    </script> 

Answer 4

, 당신은이를 사용할 수 있습니다 JQuery와의

$("#onstage").click(function(){ 
 
    $("#occupation").prop("disabled", !$(this).is(":checked")).val(''); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label class="checkbox-inline"> 
 
    <input type="checkbox" value="" id="onstage"/> On Stage 
 
</label> 
 
<div class="col-md-9"> 
 
    <select name="occupation" id="occupation" multiple="multiple" disabled="disabled"> 
 
     <option value="Actor">Actor</option> 
 
     <option value="Supervisor">Supervisor</option> 
 
     <option value="Extra">Extra</option> 
 
    </select> 
 
</div>