表單效驗的重要性：

　　　　使用JavaScript可以十分便捷地進行表單驗證，它不但能檢查用戶輸入的無效或錯誤的數(shù)據(jù)，還能檢查用戶遺漏的必選項，從而減輕服務器的壓力，避免服務器端的信息出現(xiàn)錯誤。

表單選擇器

　　:input：匹配所有input，textarea，select和button元素；

　　:text：匹配所有單行文本框；

　　:password：匹配所有密碼框；

　　:radio：匹配所有單項按鈕；

　　:checkbox：匹配所有復選框；

　　:submit：匹配所有提交按鈕；

　　:image：匹配所有圖像域；

　　:reset：匹配所有重置按鈕；

　　:button：匹配所有按鈕；

　　:file：匹配所有文件域；

　　:hidden：匹配所有不可見元素，或者type為hidden的元素

　　　　

表單屬性過濾器

　　:enabled：匹配所有可用元素；

　　:disabled：匹配所有不可用元素；

　　:checked：匹配所有被選中元素（復選框，單項按鈕，select中的option）；

　　:selected：匹配所欲選中的option元素；

表單驗證事件的方法

　　事件：

　　　　onblur：失去焦點，當光標離開某個文本框是觸發(fā)；

　　　　onfocus：獲得焦點，當光標進入某個文本框時觸發(fā)；

　　方法：

　　　　blur()：從文本域中移開焦點；

　　　　focus()：在文本域中設置焦點，即獲得光標；

　　　　select()：選取文本域中的內容，突出顯示

　　　　

　　　　

正則表達式：

　　定義正則表達式：

　　　　普通方法：

　　　　　　var reg=/表達式/ 附加參數(shù)/

　　　　　　表達式：一個字符串代表了某種規(guī)則，其中可以使用某些特殊字符來代表特殊的規(guī)則

　　　　　　附加參數(shù)：用來擴展表達式的含義；

　　　　　　參數(shù)：

　　　　　　　　g：代表可以進行全局匹配；

　　　　　　　　i：代表不區(qū)分大小寫匹配；

　　　　　　　　m：代表可以進行多行匹配；

　　　　　　實例：

　　　　　　　　var reg=/white/;

　　　　　　　　var reg=/white/g;　　

　　　　構造函數(shù)：

　　　　　　var reg=new RegExp("white");

　　　　　　var reg=new RegExp("white","g");

　　　　　　說明：

　　　　　　　　普通方式中的表達式必須是一個常量字符串，而構造函數(shù)中的表達式可以是常量字符串，也可以是一個JavaScript變量。

　　表達式的模式：

　　　　簡答模式：

　　　　　　簡答模式是指通過普通字符的組合來表達模式。

　　　　　　var reg=/china/;

　　　　　　var red=/abc8/;

　　　　復合模式：

　　　　　　復合模式是指定有通配符來表達的模式

　　　　　　var reg=/^w+$/;

　　　　　　RegExp對象：

　　　　　　　　exec()：檢索字符中是正則表達式的匹配，返回找到的值，并確定其位置；

　　　　　　　　test()：檢索字符串中指定的值，返回true過false;

　　　　　　　　　　 var str="my cat";

　　　　　　　　　　var reg=/cat/;

　　　　　　　　　　var result=reg.test(str);

　　　　　　String對象的方法：

　　　　　　　　match()：找到一個或多個正則表達式的匹配；

　　　　　　　　search()：檢索與正則表達式相匹配的值；

　　　　　　　　replace()：替換與正則表達式匹配的字符串；

　　　　　　　　split()：把字符串分割為字符串數(shù)組；

　　　　　　match()方法：

　　　　　　　　var str="my cat";

　　　　　　　　var reg=/cat/;

　　　　　　　　var result=str.match(reg);

　　　　　　replace()方法：

　　　　　　　　var str="my little white cat,is really a very lively cat";

　　　　　　　　var result=str.replace(/cat/,"dog");

　　　　　　　　var results=str.replace(/cat/g,"dog");

　　　　　　split()方法：

　　　　　　　　var str="red.blue,green,white";

　　　　　　　　var result=str.split(",");

　　　　　　　　var string="";

　　　　　　　　for(var i=0;i<result.length;i++){

　　　　　　　　　　string+=result[i]+"\n";

　　　　　　　　}

　　　　　　　　alert(string);

　　　　　　RegExp對象的屬性：

　　　　　　　　global：RegExp對象是否具有標志g;

　　　　　　　　ignoreCase：RegExp對象是否具有標志i;

　　　　　　　　multiline：RegExp對象是否具有標志m;

正則表達式

　　　　正則表達式的常用符號：

　　　　　　　　

　　　　正則表達式的重要字符：

　　　　　　　　

　　　　　　正則表達式(),[],{}的區(qū)別：

　　　　　　　　　　()：為了提取匹配的字符串，表達式中有幾個()就有幾個相應的匹配字符串；

　　　　　　　　　　[]：定義匹配的字符串；

　　　　　　　　　　{}：用來匹配長度；

　　　　　　實例：

　　　　　　　　　　

　　　　　　　　　　

使用HTML5的方式驗證表單

　　HTML5新增驗證屬性

　　　　　　

　　　　placeholder：

　　　　　　　　

　　　　required：

　　　　　　　　

　　　　pattern：

　　　　　　　　

　　validity屬性：

　　　　　　

　　　　　　

　　　　　　

　　　　實例：

　　　　　　

轉載于:https://www.cnblogs.com/tinghao/p/11069444.html

總結

以上是生活随笔為你收集整理的第九章 表单效验的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。