유효성 검사 메시지가 중간에 트리거되었습니다.

Question

다음 코드가 있는데 확인란을 선택 취소하면 유효성 검사 메시지가 표시됩니다.

내 코드

jQuery를 내가 양식을로드 할 때마다

<div class="editor-field"> 
    <%:Html.CheckBox("TermsAndConditions")%> <%: Html.ActionLink("I agree Terms and Conditions", "Terms", "Home")%> 
</div> 

그러나, 경고 메시지가 표시

if($('#TermsAndConditions').is(':checked')) 
{ 
} else { 
    alert('Not checked); 
} 

보기. 문제를 파악하도록 도와 줄 수 있습니까?

Answer 1

이것은 페이지 위쪽에 스크립트를 배치했기 때문에 발생합니다. 본질적으로 스크립트는 범위에 #TermsAndCondition 체크 박스가 존재하기 전에로드되어 사용자의 조건을 실패하고 else를 트리거하며, 바람직하지 않은 이벤트 (예 : 양식 제출 또는 체크 박스 상태 업데이트)에 의해 트리거되지 않습니다.

확인란 상태가 변경되는 경우와 같이 이벤트가 트리거 될 때 작업을 수행해야합니다.

$("#TermsAndConditions").on("change", function(){ 
    if($(this).is(':checked')) 
    { 
    } else { 
     alert("Not checked"); 
    } 
}); 

또는 양식

당신이 당신의 jQuery 코드를 넣어

$("#YourFormId").on("submit", function(e){ 
    if($("#TermsAndConditions").is(':checked')) 
    { 
     // Form will submit 
    } else { 
     // Form will not submit 
     alert("Not checked"); 
     e.preventDefault(); 
    } 
}); 

See working demo here

Answer 2

를 제출할 때? 페이지가 완전히로드 된 후 실행되고 있습니까? 당신은 아마 다음과 같이 $(function(){ .. code .. });에 넣어해야합니다

$(function(){ 
    if($('#TermsAndConditions').is(':checked')) { 

    } 
    else { 
     alert('Not checked); 
    } 
}); 

또는 @Duk 같은

이벤트를 제출 바인딩 말했다.

Answer 3

$('#TermsAndConditions').on('change', function() { 
    if (this.checked) { 

    } else { 
     alert('Not checked'); 

    } 
}); 

또는 양식을 작성하려는 다른 핸들러. 예 :

DEMO

Answer 4

그 어떤 이벤트에 바인딩 할 수 있기 때문에 페이지 load.use change 이벤트 기간 동안

$(document).ready(function(){ 
    $('#TermsAndConditions').change(function(){ 
      if($(this).is(':checked')) { 

      } 
      else { 
       alert('Not checked); 
      } 
     }); 
    });