2016-10-21 4 views
0

내가 거의 양식 유효성 검사를 완료 제대로 (순수 자바 스크립트)에서 작성하는 경우 확인하지만, 나를 위해 엉덩이에 유일한 고통은 다음과 같습니다입력 필드가

1 일부가 작성 때 입력 필드는 자신을 점검해야한다) 입력 필드에서 입력 상자 외부를 클릭하십시오.

2) 누군가가 모든 입력란을 비워두고 보내기 버튼을 클릭하면 2)

누구나 그 문제를 어떻게 해결할 수 있습니까?

function validateForm() { 
 
\t var name = document.getElementById("name"); 
 
\t var email = document.getElementById("email"); 
 
\t var nameValidation = document.getElementById("nameValidation"); 
 
\t var emailValidation = document.getElementById("emailValidation"); 
 
\t var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/; 
 

 
\t if (name.value.length == "") { 
 
\t \t nameValidation.innerHTML = " Please fill in your name"; 
 
\t \t name.focus(); 
 
\t } else { 
 
\t \t nameValidation.innerHTML = " Right"; 
 
\t } 
 
\t 
 
\t if(!filter.test(email.value) || (email.value.length == "")) { 
 
\t \t emailValidation.innerHTML = " Please enter a valid email address"; 
 
\t \t email.focus(); 
 
\t } 
 
\t else { 
 
\t \t emailValidation.innerHTML = " Right!"; 
 
\t } 
 
}
<form action="#" id="form" method="post" name="form"> 
 
    <img id="close" src=IMAGE/close.png alt="close-button" onclick="div_hide()"/> 
 
    <h3><b>Application form</b></h3> 
 
    <input id="name" class="application" name="name" placeholder="Name" type="text" maxlength="30" /><span id="nameValidation"></span><br/> 
 
    ><input id="email" class="application" placeholder="Email" type="text" maxlength="254" /><span id="emailValidation"></span> 
 

 
    <div id="upload-box"> 
 
     <input id="upload" class="application upload" type="file"/> 
 
     <input id="submit" class="application apply-button" type="button" onclick="validateForm()" value="Send"/> 
 
    </div> 
 
    </form

답변

2
<input type="email" required /> 

작업 수행.

관련 문제