可以一个html5表单验证
<form>
<input type="email" id="email" placeholder="Enter your email here..." required>
<button type="submit">Submit</button>
</form>
没有表格也可以吗
<div>
<input type="email" id="email" placeholder="Enter your email here..." required>
<button type="submit">Submit</button>
</div>
【问题讨论】：
标签： html validation
是的，使用约束验证 API。见http://www.w3.org/TR/html5/forms.html#the-constraint-validation-api。例如，您可以拨打element . checkValidity()。另见https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation 或https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement/checkValidity。例如：
var email = document.getElementById('email');
var valid = email . checkValidity();
if (!valid) ...
或使用checkValidity() 失败时触发的invalid 事件：
email.addEventListener("invalid", function() { alert("Email invalid"); });
您可以使用setCustomValidity 设置有效性状态和/或错误消息：
if (!email.value) email.setCustomValidity("Email is missing");
【讨论】：
如果您想查看页面中的错误，而不仅仅是接收带有验证结果的布尔值，您可以使用：
document.gelElementById('email').reportValidity();
【讨论】：