資源描述:
《css基本的表單驗證技術(shù)》由會員上傳分享,免費在線閱讀,更多相關(guān)內(nèi)容在教育資源-天天文庫。
1、第五章基本的表單驗證技術(shù)回顧簡述制作樣式特效的大致步驟。簡述制作改變按鈕背景圖片特效的大致步驟。簡述層的顯示/隱藏特效的實現(xiàn)思路。簡述圖片的顯示/隱藏特效的的實現(xiàn)思路。本章任務(wù)演示示例1:具有驗證功能的登錄頁面演示示例2:具有驗證功能的注冊頁面制作具有驗證功能的登錄頁面制作具有驗證功能的注冊頁面本章目標會使用DOM模型的層次關(guān)系訪問元素會使用表單事件和腳本函數(shù)實現(xiàn)表單驗證會使用String對象和文本框控件常用屬性和方法實現(xiàn)客戶端驗證為什么需要表單驗證服務(wù)器IE腳本在客戶端執(zhí)行,減輕服務(wù)器端的壓力客戶端用戶輸入客戶端用戶輸入……客戶端用戶輸入……發(fā)送請求返回響應(yīng)發(fā)送
2、請求返回響應(yīng)發(fā)送請求返回響應(yīng)表單驗證的內(nèi)容-1不能為空且不能有數(shù)字不能為空且不能有數(shù)字不能為空,且只能包括字母、數(shù)字和下劃線字符密碼不能為空并且最少為6位,還要求兩次輸入的密碼要一致表單驗證的內(nèi)容-2不能為空且包含字符@和.只能二選一年月日不能為空,且不能超出其要求的范圍表單驗證的思路-1如何編寫腳本驗證表單?1、獲取表單元素的值(String類型),然后進行判斷2、觸發(fā)表單(FORM)的提交事件(onSubmit)表單驗證的思路-2常用的String對象使用var語句varnewstr="這是我的字符串"創(chuàng)建String對象varnewstr=newString
3、("這是我的字符串“)調(diào)用方法和屬性字符串對象.屬性名字符串對象.方法名()表單驗證的思路-3名稱說明屬性length獲取字符串字符的個數(shù)方法indexOf(“子字符串”,起始位置)查找子字符串的位置charAt(index)獲取位于指定索引位置的字符substring(index1,index2)求子串toLowerCase()將字符串轉(zhuǎn)換成小寫toUpperCase()將字符串轉(zhuǎn)換成大寫String對象常用的屬性和方法語法:indexOf(“查找的子字符串”,查找的起始位置)返回子字符串所在的位置;如果沒找到,返回-1例如:varxvary=“abcdefg”
4、;x=y.indexOf(“c”,0);//返回結(jié)果為2,起始位置是0表單驗證的思路-4查看完整代碼檢查電子郵件email是否包含“@”和”.”functioncheckEmail(){varstrEmail=document.myform.txtEmail.value;if(strEmail.length==0){alert("電子郵件不能為空!");returnfalse;}if(strEmail.indexOf("@",0)==-1){alert("電子郵件格式不正確必須包含@符號!");retu
5、rnfalse;}if(strEmail.indexOf(".",0)==-1){alert("電子郵件格式不正確必須包含.符號!");returnfalse;}returntrue;}………………返回結(jié)果-1表示沒找到“@”字符獲取表單
6、元素的值表單的提交事件表單驗證的思路-5-1查看完整代碼表單驗證的思路-5-2查看完整代碼functioncheckUserName(){//驗證用戶名varfname=document.myform.txtUser.value;if(fname.length!=0){for(i=0;i0){alert("名字中包含數(shù)字"+"請刪除名字中的數(shù)字和特殊字符");retu
7、rnfalse}}}else{alert("請輸入“名字”文本框");document.myform.txtUser.focus();returnfalse}returntrue;}……驗證用戶名不能包含數(shù)字獲取表單元素的值表單驗證的思路-5-3查看完整代碼……functionpassCheck(){//驗證密碼varuserpass=document.myform.txtPassword.value;if(userpass==""){alert("未輸入密碼"+"請輸入密碼");document.my
8、form.