第一部分:form表單基礎
表單驗證使用onblur還是onchange.
JavaScript中的正則表達式
提示:在JavaScript代碼中,函數需要傳入的參數是一個對象時,在函數主體body中一定需要對這個參數進行判斷是否為null。
表單驗證的作用:把輸入的表單數據傳入給JavaScript代碼進行驗證,可以讓網絡應用程序更加可靠,也能減少服務器的負擔,同時減少客戶端與服務器的帶寬。
form表單常見需要驗證的字段:
Message(字符串),ZIP code(郵政編碼),日期(date),Phone Number(電話號碼),Email(電子郵件),smart Phone Number(手機號碼)。
form對象是一個數組,負責存儲表單中所與域的值,但它的數組元素並非利用數值索引存儲,而是使用域獨有的name屬性設定的標示符。在后台服務器接收form表單域的值也是通過name來作為標示符的。
onchange事件不可以用於驗證表單域的值是否為空。onblur事件適合觸發數據驗證。如何處理用戶復制/粘貼文本到表單域中?(onblur和onfocus是相反事件)
onblur事件:表單域失去焦點時觸發。
onfocus事件:表單元素或表單域獲得輸入的焦點時觸發。
this關鍵字,在HTML元素的上下文中,它代表該元素的對象。
alert框和彈出式廣告(pop-up ad)
alert框會阻止用戶當前進行的工作,強制用戶按下確定按鈕之后才能繼續下一步操作。這種設計具有分裂性,所以alert框不適合用在數據驗證的提示。
pop-up框目前是一種使用非常多的提示用戶的方法。一方面可以在很小的空間顯示更多的內容,另一方面能大大提供應用程序的交互性。缺點是在mobile devices時,操作起來不是很方便,同時開放起來相對要復雜一些,需要做適配設備的顯示分辨率。
表單域的所有驗證都通過后,可以調用form.submit()方法將表單的值提交給服務器。
第二部分:正則表達式(Regular Expression)
正則表達式專門設計用於匹配(match)文本模式(pattern),可用於創建模式,然后應用於文本字符串,搜索匹配的部分。
/Expression/ 正則表達式總是以斜線起始和結束。
元字符
. |
匹配任何字符,換行符(newline)除外 |
\d |
匹配任何數字字符 |
\w |
匹配任何字母和數字字符串 |
\s |
匹配空格 |
^ |
字符串以模式起始,從第一個字符開始匹配 |
$ |
字符串以模式結束,必須以此作為結束 |
| |
選擇(|)提供指定可選的子模式 |
限定符前子模式(sub-pattern),限定符即應用於子模式,並控制子模式出現在模式里面的次數。
* |
限定符前的子模式必須出現0或多次 |
+ |
限定符前的子模式必須出現1次或多次 |
? |
限定符前的子模式必須出現0或1次 |
{n} |
限定符前的子模式必須出現恰好n次 |
{min,max} |
限定符前的子模式必須出現至少min次,至多max次 |
() |
集合字符,/,元字符,成為子模式 |
字符串
[CharacterClass] 字符串總是以方括號圍起來。一組匹配單一字符的正則表達式規則。
需要轉義的特殊字符,必須在字符前加上反斜線(\)來轉義:
[、]、^、$、.、|、?、*、+、(、)。