자바 스크립트 양식 유효성 검사가 작동하지 않습니다 - 스크립트가 호출되지 않습니까?

Question

나는 꽤 솔직 자바 스크립트 폼 유효성 검사 스크립트를 작성했습니다 :

가 제출 된 것

<form name="contactForm" onsubmit="return validateForm()" action="./thankyou.html" method="post"> 
     <label for="firstName">First Name <sup>*</sup></label> 
     <input name ="firstname" id="firstName" type="text" placeholder="First Name" required /> 
     <label for="lastName">Last Name <sup>*</sup></label> 
     <input name ="lastname" id="lastName" type="text" name="lastName" placeholder="Last Name" required /> 
     <label for="emailaddress">Email address <sup>*</sup></label> 
     <input name="emailaddress" id="emailAddress" type="email" placeholder="something@example.com" required /> 
     <label for="message">Message<sup>*</sup></label> 
     <textarea id="message" placeholder="Remember, be nice!" required></textarea> 
     <input type="submit" name="submit" value="Email Me!" class="emailsub" /> 
     <p class="small"><sup>*</sup> denotes a required field.</p> 
    </form> 

, 실제로 전화를하지 않는 것 :

 function validateForm(){ 
     var x=document.forms["contactForm"]["firstname"].value; 
     if (x==null || x==""){ 
      return false; 
     } 

     var y=document.forms["contactForm"]["lastname"].value; 
     if (y==null || y==""){ 
      return false; 
     } 

     var z=document.forms["contactForm"]["emailaddress"].value; 
     var atpos=z.indexOf("@"); 
     var dotpos=z.lastIndexOf("."); 
     if (atpos<1 || dotpos<atpos+2 || dotpos+2>=z.length){ 
      return false; 
     } 
     var msg_area = document.getElementById("message"); 
     msg_area.innerHTML = ""; 
     if (document.getElementById("message").value.length < 20) { 
      return false; 
     } 
     else document.getElementById("contactForm").submit(); 
    } 

그것은이 양식의 유효성을 검사해야하는데 자바 스크립트. 그것이 찾는 유일한 것은 html의 "필수"부분을 충족한다는 것입니다. 나는 자바 스크립트에 익숙하지 않기 때문에 문제가있는 곳에서 눈에 띄게 분명하지만 분명히 나 자신을 찾을 수는 없다.

도움을 주시면 감사하겠습니다.

p.s. 이것은 현재 현지 웹 사이트를위한 것이므로 action = ""은 페이지를 처리하는 대신 다른 HTML로 이동합니다. 이것이 아마도 여기의 문제일까요?

Answer 1

html5 "required"속성은 계속 진행하기 전에 브라우저가 유효성을 검사하도록합니다. read more here. 즉, 기본 유효성 검사 (필수 필드 및 전자 메일)를 통과하지 않으면 자바 스크립트 함수가 호출되기 전에 이벤트가 중지됩니다 (지원되는 브라우저에서).

자바 스크립트를 실행하고 자신의 유효성 검사를 수행하려면 "필수"속성을 제거해야합니다. 좀 더 복잡한 HTML 폼 유효성 검사를 시도 할 수도 있습니다. Here is a good article on the subject.