摘 要:表單是實現用戶和網頁界面之間人機交換信息的重要工具,無論是登陸賬戶界面還是用戶注冊賬戶界面,都通過表單操作來提取用戶信息。JavaScript語言作為最重要的客戶端腳本語言,能很方便快速的實現表單驗證操作。本文結合實例詳細介紹了如何利用JavaScript語言實現客戶端的表單驗證方法。
關鍵詞:JavaScript;代碼;表單驗證
一、引言
隨著web技術的廣泛應用,無論是登陸賬戶界面還是用戶注冊賬戶,客戶端界面都是通過表單來提取用戶有效信息。表單已經成為傳遞信息提交數據的重要載體,扮演著十分重要的角色。這就引出了一些問題,提交的表單數據是否合法,如果數據不合法怎么辦?作為最重要的客戶端腳本語言,利用JavaScript語言編寫程序段進行表單驗證,是目前最通用的方法,在實際應用中具有較好的兼容性和跨越性,能夠方便快捷的解決表單驗證這些問題。
二、表單驗證的必要性
在對表單提交的信息進行處理前,首先要對其進行合理性驗證,避免信息無法更新或出現軟件BUG,影響用戶的正常使用。用戶在填寫表單信息時,可能在表單中輸入不正確的數據,如輸入字符串長度與賬戶要求的數據長度不一樣;輸入的數據類型與數據庫中定義的字段類型不一致;在不允許輸入空值的地方,不輸入任何數據等。如果不進行表單驗證,這些都會造成服務器端的信息無法更新或出現錯誤。進行表單驗證能避免出現這些錯誤。
為了減輕服務器壓力,表單驗證應該在客戶端頁面中進行,提醒用戶注意一些常見的錯誤和數據的合理性并給出相應的錯誤提示,而不必等待服務器的響應,從而減少服務器的處理任務和運行壓力,同時也提高了用戶的操作效率。
基于以上原因,我們有必要使用JavaScript在客戶端對表單數據進行驗證。
三、表單驗證的內容
在開始編寫表單驗證代碼之前,我們需要先分析一下表單驗證的具體內容。其實,表單驗證包括的內容非常多,如驗證用戶名、密碼是否正確,驗證日期格式是否正確,驗證電話號碼和E-mail地址是否有效、驗證驗證碼是否匹配等,驗證的目的是阻止不合格的表單信息被提交給服務器端,影響服務器的正常運行。
下面我們就以常用的注冊表單為例,來說明表單驗證通常包括哪些大致內容。
注冊表單驗證大概有以下幾項:檢查用戶名是否為空(這里不包含驗證服務器端已經存在的用戶名被重復注冊);驗證用戶輸入的兩次密碼是否一次;驗證出生日期是否符合常識(如月份必須是1-12之間,日期必須是1-31之間,區分大月和小月,區分是否為閏年);驗證用戶輸入的電話號碼(為11位的數字)和郵件地址是否有效(如電子郵件地址中必須有“@”和“.”字符);驗證驗證碼是否與已顯示的驗證碼相同等。
四、常用的表單驗證的代碼實現過程
在展示詳細代碼前先對表單信息進行定義,定義表單窗口名為TableForm,定義用戶名文本框名為MyNameTxt,定義密碼文本框名為PasswordTxt,定義二次密碼文本框名為rPasswordTxt。電話號碼、電子郵箱、驗證碼等驗證代碼省略(參考驗證用戶名代碼和密碼代碼)。
五、結束語
JavaScript語言是一種功能非常強大的腳本設計語言,我們可以使用它很方便快速的在客戶端對表單數據驗證編寫代碼,避免表單數據出現錯誤,為服務器端接收到的數據有效性起到保障作用。
參考文獻:
[1] (美)Karli Watson Christian Nagel等,C#入門經典(第4版),清華大學出版社
[2] 明日科技 JavaScript從入門到精通,清華大學出版社
[3] (美)鮑爾斯 學習JavaScript ,東南大學出版社