HTML5中表单验证有如下好处：
1、可判断用户是否已填写表单中的必填项目。
2、可判断用户输入的邮件地址是否合法。
3、可判断用户是否已输入合法的日期。
4、可判断用户是否在数据域(numeric field)中输入了文本。
表单验证通常采用策略模式的思想，把一个个验证规则封装成一个函数，比如非空规则、最大长度规则等，不同的输入框选择某一个或者某几个规则进行验证。
扩展资料：
HTML表单一直都是Web的核心技术之一，有了它才能在Web上进行各种各样的应用。HTML5 Forms新增了许多新控件及其API，方便做更复杂的应用，而不用借助其它Javascript框架。
表单有以下几个基本知识点：
1、表单仍是以<form>元素作为容器，可在其中设置基本的提交特性。
2、当用户提交页面时，表单仍然向服务器发送表单控件的值。
3、之前老版本中的表单控件，如text radio checkbox等等，都可以按原有方式使用，尽管增加了新的功能。
4、仍然可以使用javascript操作表单控件。
<HTML><HEAD>
<TITLE>生成验证码</TITLE>
<SCRIPT LANGUAGE="JavaScript">
function createCode(len)
{
var seed = new Array(
'abcdefghijklmnopqrstuvwxyz',
'ABCDEFGHIJKLMNOPQRSTUVWXYZ',
'0123456789'
)//创建需要的数据数组
var idx,i
var result = ''//返回的结果变量
for (i=0i<leni++) //根据指定的长度
{
idx = Math.floor(Math.random()*3)//获得随机数据的整数部分-获取一个随机整数
result += seed[idx].substr(Math.floor(Math.random()*(seed[idx].length)), 1)//根据随机数获取数据中一个值
}
return result//返回随机结果
}
function test() {
var inputRandom=document.getElementById("inputRandom").value
var autoRandom=document.getElementById("autoRandom").innerHTML
if(inputRandom==autoRandom) {
alert("通过验证")
} else {
alert("没有通过验证")
}
}
</SCRIPT>
</HEAD>
<BODY>
验证码长度：
<SELECT id="sel">
<option value=1>1</option>
<option value=3>3</option>
<option value=5>5</option>
<option value=7 selected>7</option>
<option value=9>9</option>
</SELECT>
<BR>
<table>
<tr>
<td>验证码：</td>
<td><input type="text" id="inputRandom"></td>
<td><label id="autoRandom" value=""></label><INPUT TYPE="button" VALUE="获取验证码" ONCLICK="autoRandom.innerHTML=createCode(sel.value)"></td>
<td><input type="button" value="验证" onclick="test()"></td>
</tr>
</table>
<script type="text/javascript">
window.onload()=autoRandom.innerHTML=createCode(sel.value)
</script>
</BODY>
</HTML>
分享
本回答
