html5自带的表单验证

时间:2022-06-03 07:56:21

后来仔细一看出了点问题。以后再更新。



纯前端html5+js验证

html5自带的表单验证

<body>
<form action="">
生日:<input name="birth" type="date" id="birth" />
邮箱:<input name="email" type="email" id="email" />
<input type="submit" value="提交" onclick="return check();" />
</form>
<script>
var check = function ()
{
return commonCheck(birth, "生日", "字段必须是有效日期!")
&& commonCheck(email, "邮箱", "字段必须是有效!");
}
var commonCheck = function (file, filename, tip)
{
var targetEle = document.getElementById(file);
if (targetEle.value.trim() == "") {
alert("必须填写!");
return false;
}
else if (!targetEle.checkValidity()) {
alert(filename + tip);
return false;
}
return true;
}
</script>
</body>