1. 默認(rèn)提示

html5豐富了表單驗(yàn)證，例如：

<form>      <input type=text required />      <input type=submit></form>

如果text中沒(méi)有輸入內(nèi)容，點(diǎn)擊提交按鈕，會(huì)提示“請(qǐng)?zhí)顚?xiě)此字段。”

事件順序如下：
（1）submit按鈕的click事件，若取消默認(rèn)事件，則終止
（2）html5表單驗(yàn)證和提示，若表單驗(yàn)證不通過(guò)，則提示第一個(gè)不合法輸入，并終止
（3）form表單的submit事件，若取消默認(rèn)事件，則終止

注意：
用js觸發(fā)form的submit事件，會(huì)直接進(jìn)入第（3）步，不會(huì)進(jìn)行html5表單驗(yàn)證。
所以，要想出現(xiàn)html5的驗(yàn)證提示，必須經(jīng)過(guò)submit按鈕。

2. 自定義提示

使用setCustomValidity設(shè)置了自定義提示后，
validity.customError就會(huì)變成true，則checkValidity總是會(huì)返回false。
而且，表單驗(yàn)證是根據(jù)checkValidity來(lái)決定是否提示的。

所以，應(yīng)該使用validity的以下屬性來(lái)設(shè)置和取消自定義提示：

badInput，customError，patternMismatch，rangeOverflow，rangeUnderflow，stepMismatch，tooLong，  typeMismatch，valid，valueMissing

注意：
以上屬性值是只讀的，手動(dòng)修改是無(wú)效的。

其中，取消自定義提示的方式如下：

setCustomValidity('') setCustomValidity(null) setCustomValidity(undefined)

例子：

<form>      <input id=text1 type=text required />      <input id=submit1 type=submit></form><script>      document.querySelector('#submit1').addEventListener('click',function(){              var $text1= document.querySelector('#text1');            $text1.validity.valueMissing              ?$text1.setCustomValidity('The value can't be empty.')              : $text1.setCustomValidity('');      },false);</script>

或者：

$text1.setCustomValidity((function(){      if($text1.validity.valueMissing){          return 'The value can't be empty.';      }    //不寫(xiě)return或者寫(xiě)“return;”表示“return undefined;”}()));

3. 驗(yàn)證成功后ajax提交

考慮到事件順序，form的submit事件中只有在表單驗(yàn)證通過(guò)后才會(huì)觸發(fā)。
所以，可以在form的submit事件中，通過(guò)取消默認(rèn)行為，用ajax提交數(shù)據(jù)。

例子：

document.querySelector('#form1').addEventListener('submit',function(e){    //ajax        e.preventDefault();  },false);