HTML5 表单验证,自定义验证信息
ZKEASOFT February 28, 2017
HTML表单一直都是Web的核心技术之一,有了它我们才能在Web上进行各种各样的应用。HTML5 Forms新增了许多新控件及其API,方便我们做更复杂的应用,而不用借助其它Javascript框架。接下来我们用几行简单的代码改掉默认的验证提示信息。
document.addEventListener("DOMContentLoaded", function() {
var elements = document.getElementsByTagName("INPUT");
for (var i = 0; i < elements.length; i++) {
elements[i].oninvalid = function(e) {
e.target.setCustomValidity("");
if (!e.target.validity.valid) {
e.target.setCustomValidity("这个字段是必填的呦。");
}
};
elements[i].oninput = function(e) {
e.target.setCustomValidity("");
};
}
})
有关于更多HTML5的表单验证请参阅:
See the Pen HTML 5 Custom Validition Message by seriawei (@seriawei) on CodePen.