html5表单

<form id="myForm" action="http://www.baidu.com"></form>
<input type="text" form="myForm">
<input type="submit" form="myForm">
指向表单元素

关于email
<form id="myForm" action="http://www.baidu.com"></form>
<input type=email name=email form="myForm">
<input type="submit" form="myForm">

关于url
<form id="myForm" action="http://www.baidu.com"></form>
<input type=url name=url form="myForm">
<input type="submit" form="myForm">

关于时间
<form id="myForm" action="http://www.baidu.com"></form>
<input type=url name=url form="myForm">
<input type="date">
<input type=time>
<input type=month>
<input type=week>
<input type=datetime>
<input type=datetime-local/>
后边两个支持率相当差，不推荐使用

关于number
<input type="number" max=10 min=0 step=2 value="5"/>
关于range
<input type="range" value="100" />
<input type="range" max=10 min=0 step=1 value=5>

关于color
<input type="color" value="#34538b" />

required默认验证规则
<input id=placeholder name=name required form="myForm">
<input id=placeholder name=require1 required="required" form="myForm">
自定义验证
非常不推荐，有时候正则表达式比较多
<input name=require2 pattern="^[1-9]\d{5}$" form="myForm">

maxLength
<textarea id="notes" name="notes" maxLength="10"></textarea>

关于提示文字
<input id=placeholder name=require1 required="required" oninvalid="setCustomValidity('滚蛋')"  form="myForm">

<input name=require2 pattern="^[1-9]\d{5}$" oninput="setCustomValidity('gun')" form="myForm">

autofocus自动获得焦点
maxLength<textarea id="notes" name="notes" maxLength="10" autofocus="true"></textarea>