확인란을 선택 취소하면 비활성화 됨

Question

확인란을 선택하지 않은 경우 제출 버튼을 비활성화하는 데 문제가 있습니다. 그것은 체크 박스를 제외하고 다른 모든 것을 위해 작동합니다.

<fieldset> 
    <input class="disableButton" id="card" type="text" /> 
    <select class="selected-state disableButton" id="month" > 
     <option value="">Exp. Month</option> 
     <option value="01">01 - Jan</option> 
     ... 
    </select> 
    <select class="selected-state disableButton" id="year" /> 
     <option value="">Exp. Year</option> 
     <option value="2014">2014</option> 
     ... 
    </select> 
    <input class="disableButton" id="cvc" type="text" /> 
     <p>I agree to the <a href="http://nofusstoothbrush.com/terms-conditions/" target="_blank">Terms and Conditions</a> <input id="termsCheck" type="checkbox" checked></p> 
    <input type="button" name="previous" class="previous action-button" value="Previous" /> 
    <input id="submitCard" class="action-button" type="submit" value="Submit" disabled="disabled" title="Please fill all required fields" /> 
</fieldset>  

$(document).ready(function(){ 
      $('.disableButton').on('keyup change', function(){ 
       if ($('#card').val().length < 10 || $('#cvc').val().length < 3 || $('#month').val() == '' || $('#year').val() == '' || $('#termsCheck').attr('checked') == false){ 
         $('#submitCard').prop('disabled', true); 
       } else { 
         $('#submitCard').prop('disabled', false); 
       } 
      }); 
    }); 

Answer 1

사용 .is(':checked') 또는 .prop('checked') 체크 박스의 상태를 평가하기 :

$(document).ready(function(){ 
    $('.disableButton').on('keyup change', function(){ 
     if ($('#card').val().length < 10 || $('#cvc').val().length < 3 || $('#month').val() == '' || $('#year').val() == '' || !$('#termsCheck').is(':checked')){ 
       $('#submitCard').prop('disabled', true); 
     } else { 
       $('#submitCard').prop('disabled', false); 
     } 
    }); 
}); 

여기서 일하는 예를 참조하십시오 : http://jsfiddle.net/teddyrised/m9KN4/

또한 체크 박스 요소에 클래스 disabledButton을 추가 할 필요가

하고,로를 엄지 손가락의 규칙은 명시 적으로 동의해야하는 사용자 여야합니다. 따라서 의 선택을 취소하는 것이 좋습니다. :

<input id="termsCheck" type="checkbox" class="disableButton" /> 

P/S를 : 나는 당신이 실수로 <select> 요소의 하나 자동 폐쇄를 ...

Answer 2

<form> 
    <input class="disableButton" id="card" type="text" /> 
    <select class="selected-state disableButton" id="month" > 
    <option value="">Exp. Month</option> 
    <option value="01">01 - Jan</option> 
    ... 
    </select> 
    <select class="selected-state disableButton" id="year" /> 
    <option value="">Exp. Year</option> 
    <option value="2014">2014</option> 
    ... 
    </select> 
    <input class="disableButton" id="cvc" type="text" /> 
    <p>I agree to the <a href="http://nofusstoothbrush.com/terms-conditions/" target="_blank">Terms and Conditions</a> <input id="termsCheck" type="checkbox" checked></p> 
    <input type="button" name="previous" class="previous action-button" value="Previous" /> 
    <input id="submitCard" class="action-button" type="submit" value="Submit" disabled="disabled" title="Please fill all required fields" /> 
</form>  


$(document).ready(function(){ 
    $('form').on('keyup change', function(){ 
    if ($('#card').val().length < 10 || $('#cvc').val().length < 3 || $('#month').val() == '' || $('#year').val() == '' || $('#termsCheck').prop('checked') == false){ 
     $('#submitCard').prop('disabled', 'disabled'); 
    } else { 
     $('#submitCard').prop('disabled', ''); 
    } 
    }); 
}); 

http://jsfiddle.net/622WM/1/