유효성 검사가 왜 두 번째 입력 필드에 양식을 제출하지 못하게합니까?

페이지의 다른 부분에 출력을 생성하여 제출할 때 양식이 있습니다. 모든 클라이언트 측. 내가 생성하기 전에 양식을 유효성을 검사 할 출력 : numberOne의 유효성 검사가 잘 작동되고 실행되는 내 코드를 방지 할 수 있지만 numberTwo 것이 submitHandler 여전히 실행할 수 있도록 나타납니다 유효성 검사가 왜 두 번째 입력 필드에 양식을 제출하지 못하게합니까?

<html> 
<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
    <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script> 
</head> 
<body> 
    <script language="javascript"> 
     $(document).ready(function() { 
      $("#processForm").validate({ 
       submitHandler: function(form) { 
        $("#output").empty().append($("#numberOne").val()); 
       } 
      }); 
     }); 
    </script> 
    <form id="processForm"> 
     <p><input type="text" id="numberOne" value="37" class="required number"/></p> 
     <p><input type="text" id="numberTwo" value="63" class="required number"/></p> 
     <!--<p><input type="submit" value="Submit"/></p>--> 
     <p><button type="submit">Submit</button></p> 
    </form> 
    <div id="output"></div> 
</body> 
</html>

. 단계 재현 :

열기를 눌러 제출 통지 (37) 아래에 인쇄 버튼
이 눌러 버튼을 제출 첫 번째 필드에 "자위대"를 입력 제출되고, 통지 (37)는 아래에 남아 버튼
는 "5"를 입력 제출 첫 번째 필드에서 "asdf"두 번째 필드에서 제출 버튼을 누릅니다. 양식이 전체적으로 유효하지 않더라도 "제출"버튼 아래에 "5"가 표시됩니다.

오류 메시지가 표시되지만 "제출"을 누르면 오류 메시지가 지워집니다. 내가 뭘 놓치고 있니?

나는 input과 button 태그를 모두 시도했습니다.

출처

2012-07-15 earlNameless

입력에 name 속성을 사용해보십시오. 일반적으로 데이터를 처리하거나 보내는 경우 name 속성을 추가하려고합니다. 따라서, 귀하의 입력은 다음과 같이 표시됩니다

<input type="text" id="numberOne" name="numberOne" value="37" class="required number"/> 
<input type="text" id="numberTwo" name="numberTwo" value="63" class="required number"/>

내가 지금 당신이 확인할 수있는 바이올린을 만든 당신이 찾고있는 기능입니다.

http://jsfiddle.net/tokersey/FyjWs/

출처

2012-07-15 04:42:20 tokersey

감사합니다. 유효성 검사기의 소스 코드 (정확히 작동하는지 확실하지 않음)를 보면 식별자에 식별자의 이름을 사용하므로 빈 빈 이름은 규칙이 첫 번째 필드에만 적용된 이유를 설명합니다. – earlNameless

유효성 검사가 왜 두 번째 입력 필드에 양식을 제출하지 못하게합니까?

답변

관련 문제