检查输入字段是否正确填写（纯javascript）

Question

我几乎完成了表单验证，但是对我来说唯一的麻烦是：

1）当某些输入栏填写好并在输入框外单击时，应自行检查输入栏。

2）当有人将所有输入字段留空并单击“发送”按钮时。

有人知道我该如何解决吗？

 function validateForm() { var name = document.getElementById("name"); var email = document.getElementById("email"); var nameValidation = document.getElementById("nameValidation"); var emailValidation = document.getElementById("emailValidation"); var filter = /^([a-zA-Z0-9_\\.\\-])+\\@(([a-zA-Z0-9\\-])+\\.)+([a-zA-Z0-9]{2,4})+$/; if (name.value.length == "") { nameValidation.innerHTML = " Please fill in your name"; name.focus(); } else { nameValidation.innerHTML = " Right"; } if(!filter.test(email.value) || (email.value.length == "")) { emailValidation.innerHTML = " Please enter a valid email address"; email.focus(); } else { emailValidation.innerHTML = " Right!"; } } 

 <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 

Answer 1

<input type="email" required />

任务完成。