《JavaWeb程序設(shè)計基礎(chǔ)教程》課件第2章_第1頁
《JavaWeb程序設(shè)計基礎(chǔ)教程》課件第2章_第2頁
《JavaWeb程序設(shè)計基礎(chǔ)教程》課件第2章_第3頁
《JavaWeb程序設(shè)計基礎(chǔ)教程》課件第2章_第4頁
《JavaWeb程序設(shè)計基礎(chǔ)教程》課件第2章_第5頁
已閱讀5頁,還剩97頁未讀, 繼續(xù)免費閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進行舉報或認領(lǐng)

文檔簡介

第2章輸入

2.1用戶注冊界面

2.2常用表單元素

2.3使用form元素

2.4對輸入信息進行驗證

2.5設(shè)置頁面的編碼方式

小結(jié)

習題2實訓(xùn)2:圖書信息

2.1用戶注冊界面

2.1.1功能描述

使用網(wǎng)上書店的普通用戶在下訂單的時候都需要進行注冊,注冊的目的是為了網(wǎng)站能夠了解用戶信息,并方便對用戶進行管理。

注冊功能主要是提供用戶個人的信息,個人信息包括:用戶ID、用戶名、口令、生日、學(xué)歷、地區(qū)、E-mail、地址、電話和備注。對用戶提供的信息會有一些要求,具體如表2.1所示。表2.1用戶注冊信息表

2.1.2運行效果

用戶首先進入注冊界面,如圖2.1圖2.1注冊界面圖2.2驗證錯誤提示信息

2.1.3源代碼

<%@pagecontentType="text/html;charset=gb2312"%>

<scriptlanguage="JavaScript">

functionisValidate(form)

{

//得到用戶輸入的信息

userid=form.userid.value;

username=form.username.value;

userpass=form.userpass.value;

userpass2=form.userpass2.value;

birthday=form.birthday.value;

email=form.email.value;

address=form.address.value;

phone=form.phone.value;

//判斷用戶ID長度

if(!minLength(userid,6))

{

alert("用戶ID長度小于6位!");

form.userid.focus();

returnfalse;

}

if(!maxLength(userid,8))

{

alert("用戶ID長度大于8位!");

form.userid.focus();

returnfalse;

}

//判斷用戶名長度

if(!minLength(username,2))

{

alert("用戶名長度小于2位!");

form.username.focus();

returnfalse;

}

if(!maxLength(username,10))

{

alert("用戶名長度大于10位!");

form.username.focus();

returnfalse;

}

//判斷口令長度

if(!minLength(userpass,6))

{

alert("口令長度小于6位!");

form.userpass.focus();

returnfalse;

}

if(!maxLength(userpass,8))

{

alert("口令長度大于8位!");

form.userpass.focus();

returnfalse;

}

//判斷用戶ID和口令是否相同

if(userid==userpass)

{

alert("用戶ID和口令不能相等!");

form.userpass.focus();

returnfalse;

}

//驗證兩次口令是否相同

if(userpass!=userpass2)

{

alert("兩次輸入的口令不相同!");

form.userpass.focus();

returnfalse;

}

//驗證生日的格式是否正確

if(!isDate(birthday))

{

alert("生日的格式不正確!");

form.birthday.focus();

returnfalse;

}

//驗證E-mail的格式是否正確

if(!isEmail(email))

{

alert("E-mail格式不正確!");

form.email.focus();

returnfalse;

}

//驗證電話號碼的格式是否正確

if(!isDigital(phone))

{

alert("電話號碼的格式不正確");

form.phone.focus();

returnfalse;

}

//驗證地址的長度是否正確

if(!maxLength(address,50))

{

alert("地址長度大于50位!");

form.address.focus();

returnfalse;

}

returntrue;

}

//驗證是否是空

functionisNull(str)

{

if(str.length==0)

returntrue;

else

returnfalse;

}

//驗證是否滿足最小長度

functionminLength(str,length)

{

if(str.length>=length)

returntrue;

else

returnfalse;

}

//判斷是否滿足最大長度

functionmaxLength(str,length)

{

if(str.length<=length)

returntrue;

else

returnfalse;

}

//判斷是否是數(shù)字

functionisDigital(str)

{

for(i=0;i<str.length;i++)

{

//允許使用連字符

if(str.charAt(i)>='0'&&str.charAt(i)<='9'

||str.charAt(i)=='-'&&i!=0&&i!=str.length-1)

continue;

else

returnfalse;

}

returntrue;

}

//判斷是否是整數(shù)

functionisNumber(str)

{

for(i=0;i<str.length;i++)

{

//每一位都是0~9的數(shù)字,如果是第1位,則可以是“-”號

if(str.charAt(i)>='0'&&str.charAt(i)<='9'

||str.charAt(i)=='-'&&i==0)

continue;

else

returnfalse;

}

returntrue;

}

//判斷是否是日期,日期的格式為1988-1-1

functionisDate(date)

{

//查找分隔符

index1=date.indexOf("-");

//如果分隔符不存在,則不是合法的時間

if(index1==-1)

returnfalse;

//獲取時間中的年

year=date.substring(0,index1);

//獲取時間中的剩下部分

date=date.substring(index1+1);

//查找第二個分隔符

index1=date.indexOf("-");

//如果不存在第二個分隔符,則不是合法的時間

if(index1==-1)

returnfalse;

//獲取時間中的月份

month=date.substring(0,index1);

//獲取時間中的日

day=date.substring(index1+1);

//判斷是否是數(shù)字,如果不是,則不是合法的時間

if(isNumber(year)&&isNumber(month)&&isNumber(day))

{

//判斷基本范圍

if(year<1900||year>9999||month<1||month>12||day<1)

returnfalse;

//判斷31天的月

if((month==1||month==3||month==5||month==7

||month==8||month==10||month==12)&&day>31)

returnfalse;

//判斷30天的月

if((month==4||month==6||month==9||month==11)

&&day>30)

returnfalse;

//如果是2月,判斷是否為閏年

if(month==2)

{

if(year%400==0||(year%4==0&&year%100!=0))

{

if(day>29)

returnfalse;

}else

{

if(day>28)

returnfalse;

}

}

}

else

returnfalse;

returntrue;

}

//判斷是否是E-mail

functionisEmail(email)

{

if(email.length==0)

returnfalse;

index1=email.indexOf('@');

index2=email.indexOf('.');

if(index1<1 //@符號不存在,或者在第一個位置

||index2<1 //.符號不存在,或者在第一個位置

||index2-index1<2 //.在@的左邊或者相鄰

||index2+1==email.length) //.符號后面沒有東西

returnfalse

else

returntrue;

}

</script>

<html>

<head>

<title>注冊界面</title>

</head>

<body>

<h2align="center">請注冊</h2>

<formname="form1"action="register_confirm.jsp"method="post"

onsubmit="returnisValidate(form1)">

<tablealign="center">

<tr>

<td>用戶ID:</td>

<td><inputtype="text"name="userid">6-8位

</td>

</tr>

<tr>

<td>用戶名:</td>

<td><inputtype="text"name="username">2-10位</td>

</tr>

<tr>

<td>口令:</td>

<td><inputtype="password"name="userpass">6-8位,不能與用戶ID相同</td>

</tr>

<tr>

<td>確認口令:</td>

<td><inputtype="password"name="userpass2"></td>

</tr>

<tr>

<td>生日:</td>

<td><inputtype="text"name="birthday">格式為:1988-1-1</td>

</tr>

<tr>

<td>學(xué)歷:</td>

<td>

<inputtype="radio"name="degree"value="???>專科

<inputtype="radio"name="degree"value="本科"checked>本科

<inputtype="radio"name="degree"value="碩士研究生">碩士研究生

<inputtype="radio"name="degree"value="博士研究生">博士研究生

<inputtype="radio"name="degree"value="其他">其他

</td>

</tr>

<tr>

<td>地區(qū):</td>

<td>

<selectname="local">

<optionvalue="華東">華東</option>

<optionvalue="華南">華南</option>

<optionvalue="華北">華北</option>

<optionvalue="東北"selected>東北</option>

<optionvalue="東南">東南</option>

<optionvalue="西南">西南</option>

<optionvalue="西北">西北</option>

<optionvalue="華中">華中</option>

</select>

</td>

</tr>

<tr>

<td>E-mail:</td>

<td><inputtype="text"name="email"></td>

</tr>

<tr>

<td>地址:</td>

<td><inputtype="text"name="address"></td>

</tr>

<tr>

<td>電話:</td>

<td><inputtype="text"name="phone">

數(shù)字和連字符,例如88223322-123</td>

</tr>

<tr>

<td>備注:</td>

<td><textarearows="8"name="comment"cols="40"></textarea></td>

</tr>

<tr>

<td><inputtype="reset"value="重置"></td>

<td><inputtype="submit"value="提交"></td>

</tr>

<table>

</form>

</body>

</html>

2.2常用表單元素

2.2.1單行文本框

在注冊功能中,輸入用戶名和生日的輸入框就是單行文本框。需要輸入少量信息時應(yīng)該使用單行文本框。

單行文本框的基本語法格式如下:

<inputtype="text"name="輸入信息的名字"value="輸入信息的值">

其中:屬性type用于確定表單元素的類型,后面我們會看到很多表單元素的格式非常類似,值為“text”表示這是一個單行文本框;屬性name的值表示要輸入的信息的名字;屬性value的值表示這個文本框的值,通常不需要value屬性,它的值一般是讓用戶輸入的。如果需要為這個輸入框取默認值,可以使用這個屬性給定默認值。

在注冊功能中,輸入用戶名的代碼為:

<inputtype="text"name="username">用戶名對應(yīng)的文本框的名字是username,服務(wù)器在獲取用戶輸入的信息時會使用這個名字。

在注冊功能中,輸入生日的代碼為:

<inputtype="text"name="birthday"value="1988-1-1">

該文本框的名字是birthday,并且使用value指定它的值為“1988-1-1”,如果用戶不修改這個值,它將作為用戶生日的默認值。

請記?。?lt;inputtype="text">表示單行文本框,name用于指定元素的名字,value可以指定默認值。

2.2.2密碼框

在注冊功能中,設(shè)置密碼時使用兩個密碼框。通常在設(shè)置密碼和身份驗證時會使用密碼框。密碼框的特點是在輸入信息之后,界面上并不顯示用戶輸入的信息,而是顯示“*”號或者“.”,但是用戶提交給服務(wù)器的信息不是“*”號或者“.”。

密碼框的基本格式如下:

<inputtype="password"name="輸入信息的名字"value="輸入信息的值">

這個格式與單行文本框非常類似,不同的是type屬性的值,這里type屬性的值為“password”,說明這個表單元素是密碼框。另外兩個屬性的作用與單行文本框完全相同。

請記?。好艽a框與單行本文框的區(qū)別是,密碼框?qū)?yīng)的type值為“password”。

2.2.3單選按鈕

在注冊功能中,用戶選擇學(xué)歷使用的是單選按鈕,并且是多個單選按鈕,每個選項對應(yīng)一個單選按鈕,用戶只能選擇其中一個,這多個單選按鈕的格式相同。如果用戶要輸入的信息只有少數(shù)幾種可能,這時應(yīng)該使用單選按鈕。

單選按鈕的基本格式如下:

<inputtype="radio"name="輸入信息的名字"value="輸入信息的值">顯示的信息

其格式與單行本文框格式基本相同,type屬性的值為“radio”,說明這個表單元素是單選按鈕。name仍然是元素的名字,value屬性的值是這個單選按鈕的值。這個值不會顯示給用戶,用戶能夠看到的是標簽后面顯示的部分。

單選按鈕通常不獨立出現(xiàn),每一種可能的選項就對應(yīng)一個單選按鈕,每個單選按鈕對應(yīng)一個不同的值,用戶選擇哪個單選按鈕,哪個單選按鈕的值就可以傳遞到服務(wù)器。

注冊功能中,用戶選擇學(xué)歷對應(yīng)的代碼如下:

<inputtype="radio"name="degree"value="1">專科

<inputtype="radio"name="degree"value="2"checked>本科

<inputtype="radio"name="degree"value="3">碩士研究生

<inputtype="radio"name="degree"value="4">博士研究生

這里,學(xué)歷有4個選項,所以有4個單選按鈕,且這4個單選按鈕的名字是相同的。用戶只能在4種情況中選擇一個,這4個單選按鈕的值分別是1、2、3和4,用戶看不到單選按鈕的值,看到的是每個標簽后的文字,即“??啤?、“本科”、“碩士研究生”、“博士研究生”等。如果用戶選擇??疲玫降闹祵⑹?;如果用戶選擇的是本科,得到的值將是2……

請記?。簡芜x按鈕的基本格式與輸入框基本相同,不同的是,type對應(yīng)的值為“radio”。有多少個可能的選項就需要多少個單選按鈕。如果需要使用默認值,則可使用checked。

2.2.4復(fù)選框

復(fù)選框與單選按鈕非常類似,相同的地方是:

●一般都不單獨出現(xiàn),而是成組出現(xiàn)。

●同一組的名字相同。

●必須指定值。

●選擇哪一個選項,得到的是這個選項對應(yīng)的值。

●每個選項的值和顯示給用戶看的信息是獨立的。

不同的地方是:

●單選按鈕對應(yīng)的type屬性的值是“radio”,而復(fù)選框?qū)?yīng)的type屬性的值是

“checkbox”。

●單選按鈕只能選擇一個,而復(fù)選框能選擇多個。

注冊功能中沒有使用到復(fù)選框,下面是一個復(fù)選框的例子,用于選擇個人的愛好。因為個人的愛好可以是多個,所以允許多選,應(yīng)該使用復(fù)選框。

<inputtype="checkbox"name="like"value="1">運動

<inputtype="checkbox"name="like"value="2">看電影

<inputtype="checkbox"name="like"value="3">聽音樂

<inputtype="checkbox"name="like"value="4">讀書

2.2.5下拉框

在注冊功能中,地區(qū)的選擇使用了下拉框,可以從地區(qū)選項中選擇一個地區(qū)。在這個例子中,只允許選擇一個,而在有些情況下,下拉框可以進行多選。所以,從功能上來說,下拉框具有單選按鈕和復(fù)選框兩者的功能。

下拉框的基本格式:

<selectname="下拉框的名字"[multiple][size=n]>

<optionvalue="值1"[selected]>值1</option>

<optionvalue="值2"[selected]>值2</option>

<optionvalue="值3"[selected]>值3</option>

<optionvalue="值4"[selected]>值4</option>

<optionvalue="值n"[selected]>值n</option>

</select>從這個格式可以看出,下拉框與前面的幾個表單元素的格式完全不同。下拉框由兩部分組成:第一部分是下拉框本身;第二部分是多個下拉框選項。

下拉框本身的開始標志是<selectname…>,結(jié)束標志是</select>。在開始標志中,name表示下拉框的名字,是必需的,它與前面介紹的其他元素的名字的作用相同。multiple屬性用于確定下拉框中的元素是否允許多選,如果允許多選,需要寫這個屬性,如果不允許多選,則不用寫,默認是單選。size屬性用于確定下拉框的顯示形式,如果size等于1,則采用下拉框的形式,如圖2.3所示;如果size大于1,則采用具有滾動條的列表框的形式,如圖2.4所示。默認情況下是下拉框的形式。

圖2.3下拉框

圖2.4列表框

下拉框中的每個選項對應(yīng)一個option標簽,開始標志是<option…>,結(jié)束標志是</option>,中間是顯示給用戶的選項。在開始標志中,可以使用value指定這個選項的值,這與單選按鈕和復(fù)選框的用法類似。另外在開始標志中,可以使用selected屬性,如果使用這個屬性,表示這個選項被選上了。如果想設(shè)定當前選項為默認選項,則可以使用selected屬性。

注冊功能中,地區(qū)選擇所使用的下拉框的代碼如下:

<selectname="local">

<optionvalue="華東"selected>華東</option>

<optionvalue="華南">華南</option>

<optionvalue="華北">華北</option>

<optionvalue="東北">東北</option>

<optionvalue="東南">東南</option>

<optionvalue="西南">西南</option>

<optionvalue="西北">西北</option>

<optionvalue="華中">華中</option>

</select>2.2.6文本域

文本域主要用于輸入多行文字,如果輸入的文字比較多,則可以采用文本域。

文本域的基本格式如下:

<textarearows="行數(shù)"name="文本域名字"cols="列數(shù)">默認值</textarea>

該標簽由3部分組成:開始標志<textarea…>,標簽的默認值,結(jié)束標志</textarea>。在標簽的開始標志中,name屬性的作用同樣是指出表單元素的名字,使用rows指定文本域的行數(shù),使用cols指定文本域的列數(shù)。

注冊功能中,輸入備注采用的就是文本框。代碼如下:

<textarearows="8"name="comment"cols="40">默認值</textarea>2.2.7重置按鈕

點擊重置按鈕可以把所有的輸入信息取消,讓輸入界面恢復(fù)到最初的狀態(tài)。在注冊界面中,如果用戶在輸入過程中不想使用已經(jīng)輸入的信息了,可以把已經(jīng)輸入的信息全部刪除,這時點擊一下重置按鈕就可以完成這個任務(wù)。

重置按鈕的基本格式如下:

<inputtype="reset"value="重置">與單行文本框的語法非常相似,重置按鈕的type值為reset。另外,在這個格式中沒有看到name屬性,這里把name屬性省略了,因為這個表單元素比較特殊,特殊的地方在于它不是用于提交信息的,所以不用給出名字,系統(tǒng)會給一個默認名字。value屬性指出這個按鈕上顯示的內(nèi)容。

2.2.8提交按鈕

只要涉及提交信息,都應(yīng)該提供一個提交按鈕,當點擊提交按鈕的時候,用戶輸入的信息將提交給服務(wù)器,意味著輸入過程的結(jié)束。注冊界面中也包含一個提交按鈕。

提交按鈕的基本格式如下:

<inputtype="submit"value="提交">

提交按鈕與重置按鈕的格式基本相同,并且提交按鈕也比較特殊。提交按鈕本身可以完成信息的提交,但是提交按鈕本身的信息通常沒有用,所以也不用給出提交按鈕的名字。提交按鈕上面顯示的內(nèi)容是value的值。

2.3使用form元素

2.3.1

使用form元素封裝要提交的信息

要向服務(wù)器提交信息,需要使用form元素,所有要提交的信息都應(yīng)該在form內(nèi)部。在注冊界面中,所有要輸入的信息都位于form元素內(nèi)部。

form元素的基本格式如下:

<formname="form1"action="目標文件"method="post|get">

各種表單元素

</form>開始標志是“<form>”,結(jié)束標志是“</form>”,中間是用于提交信息的各種表單元素。在開始標志中,name屬性指出form的名字;action指出提交給哪個文件進行處理,應(yīng)該寫處理文件的名字,如果action的值為空字符串,則提交給當前文件進行處理;method屬性指定表單提交的方式,有兩種可選的方式,即post和get,通常采用post方式。

2.3.2同一個頁面中的多個form

在同一個頁面中可以有多個form,例如下面的格式:

<formname="form1"action="目標文件"method="post|get">

第一個表單中的表單元素

</form>

<formname="formn"action="目標文件n"method="post|get">

第n個表單中的表單元素

</form>如果存在多個form,那么提交信息的時候提交哪些信息,提交給哪個文件處理,這都與提交按鈕的位置有關(guān)。如果提交按鈕在第一個form中,這時候第二個form不起任何作用,只會提交第一個form內(nèi)的表單元素的值,并且提交給第一個form的action屬性所指定的文件,由這個文件進行處理。多個form之間不會產(chǎn)生任何影響,提交按鈕在哪個form中,只會提交這個form內(nèi)部的表單元素的值,且只會提交給由這個form的action屬性所確定的處理文件進行處理。

一個頁面中可以有多個form元素,分別完成不同的信息提交任務(wù)。但是,多個form元素之間不能嵌套。例如,下面的結(jié)構(gòu)就是一個嵌套的結(jié)構(gòu),這個結(jié)構(gòu)是不正確的。

<formname="form1"action="目標文件"method="post|get">

第一個表單中的表單元素

<formname="form2"action="目標文件2"method="post|get">

第二個表單中的表單元素

</form>

</form>

2.4對輸入信息進行驗證

2.4.1JavaScript語言

在Web應(yīng)用中需要在客戶端執(zhí)行的功能可以使用JavaScript語言編寫,在使用的時候需要把JavaScript代碼放在下面的兩個標識之間:

<scriptlanguage="JavaScript">

相關(guān)JavaScript代碼

</script>

JavaScript代碼與Java代碼比較類似,但是更靈活一些。本書只介紹與客戶端驗證相關(guān)的JavaScript代碼,如果讀者想更深入地學(xué)習,可以參考專門的書籍。

通常會把對不同內(nèi)容的驗證寫成不同的方法,方法的格式如下:

function方法名(參數(shù))

{

//方法體

}2.4.2使用表單數(shù)據(jù)

要對用戶輸入的信息進行驗證,需要先獲取輸入信息。每個表單元素都屬于一個form表單,要獲取信息,需要先獲取form,然后訪問表單元素的值。

有兩種方式可以獲取form表單。

第一種方式通過document對象獲得form:

form=document.form1

其中,form1是表單元素的名字。

另一種方式是在調(diào)用驗證方法的時候把form作為參數(shù)來獲得form,本章實例中使用的就是這種方式:

isValidate(form1)

其中,form1就是表單的名字。

得到form之后,獲取表單元素的值的代碼如下:

form.userid.value

其中,userid是表單元素,value是該表單元素的值。

2.4.3調(diào)用驗證方法

驗證通常在表單提交之前進行,可以通過按鈕的onClick事件,也可以通過form表單的onSubmit事件來完成。

本章實例是通過form表單的onSubmit事件來完成的:

<formname="form1"action="register_confirm.jsp"method="post"

onSubmit="returnisValidate(form1)">如果要通過按鈕的onClick事件完成,可以使用下面的代碼:

<inputtype="button"value="提交"onClick="JavaScript:isValidate()">

如果使用這個方法,在驗證通過之后,需要編寫提交表單的代碼:

document.form1.submit();2.4.4提示用戶信息

在驗證失敗之后通常需要提示用戶錯誤信息,可以通過下面的代碼完成:

alert("地址長度大于50位!");

當使用alert提示錯誤信息時,參數(shù)是要顯示的錯誤信息。上面就是當用戶輸入的地址信息的長度大于50的時候提示用戶的信息。

如果驗證失敗,則通常會把光標放在相應(yīng)的輸入框中,可以使用下面的代碼:

form.address.focus();

如果地址的長度不合適,就會把光標放在地址輸入框中。

2.4.5常用的方法

在驗證過程中,有些方法經(jīng)常被使用,這些方法主要是與字符串處理相關(guān)的方法。假設(shè)str是一個字符串,下面列出常用的對str的處理方法:

str.length,表示字符串的長度。

str.charAt(i),獲取字符串中第i個字符,i從0開始。

str.indexOf(c),查找某個字符的位置,返回值是該字符第一次出現(xiàn)的位置,位置編號從0開始。如果沒有找到,則返回-1。

str.substring(index1,index2),獲取子串,第一個參數(shù)表示開始位置,第二個參數(shù)表示結(jié)束位置,子串包括第一個參數(shù),不包括第二個參數(shù)。如果只有一個參數(shù),則獲取從該參數(shù)開始到字符串結(jié)束的子串,此時方法就變成str.substring(index)。

str==另一個字符串,判斷str與另一個字符串是否相同。

1.非空驗證

//驗證是否是空

functionisNull(str)

{

if(str.length==0)

returntrue;

else

returnfalse;

}

2.字符串長度驗證

//驗證是否滿足最小長度

functionminLength(str,length)

{

if(str.length>=length)

returntrue;

else

returnfalse;

}

//判斷是否滿足最大長度

functionmaxLength(str,length)

{

if(str.length<=length)

returntrue;

else

returnfalse;

}

3.日期驗證

//判斷是否是日期,日期的格式為1988-1-1

functionisDate(date)

{

//查找分隔符

index1=date.indexOf("-");

//如果分隔符不存在,則不是合法的時間

if(index1==-1)

returnfalse;

//獲取時間中的年

year=date.substring(0,index1);

//獲取時間中的剩下部分

date=date.substring(index1+1);

//查找第二個分隔符

index1=date.indexOf("-");

//如果不存在第二個分隔符,則不是合法的時間

if(index1==-1)

returnfalse;

//獲取時間中的月份

month=date.substring(0,index1);

//獲取時間中的日

day=date.substring(index1+1);

//判斷是否是數(shù)字,如果不是則不是合法的時間

if(isNumber(year)&&isNumber(month)&&isNumber(day))

{

//判斷基本范圍

if(year<1900||year>9999||month<1||month>12||day<1)

returnfalse;

//判斷31天的月

if((month==1||month==3||month==5||month==7

||month==8||month==10||month==12)&&day>31)

returnfalse;

//判斷30天的月

if((month==4||month==6||month==9||month==11)

&&day>30)

returnfalse;

//如果是2月,判斷是否為閏年

if(month==2)

{

if(year%400==0||(year%4==0&&year%100!=0))

{

if(day>29)

returnfalse;

}else

{

if(day>28)

returnfalse;

}

}

}

else

returnfalse;

returntrue;

}

4.數(shù)字驗證

//判斷是否是整數(shù)

functionisNumber(str)

{

for(i=0;i<str.length;i++)

{

//每一位都是0~9的數(shù)字,如果是第1位,則可以是“-”號

if(str.charAt(i)>='0'&&str.charAt(i)<='9'

||str.charAt(i)=="-"&&i==0)

continue;

else

returnfalse;

}

returntrue;

}

5.E-mail格式驗證

//判斷是否是E-mail

functionisEmail(email)

{

if(email.length==0)

returnfalse;

index1=email.indexOf('@');

index2=email.indexOf('.');

if(index1<1//@符號不存在,或者在第一個位置

||index2<1//.符號不存在,或者在第一個位置

||index2-index1<2//.在@的左邊或者相鄰

||index2+1==email.length) //.符號后面沒有東西

returnfalse;

else

returntrue;

}

2.4.6正則表達式

正則表達式提供了一種高級的、但不直觀的字符串匹配和處理的方法。它描述了一種字符串匹配的模式,可以用來判斷一個字符串是否滿足某種格式,或者一個字符串是否含有某個子串等。

1.字符集

表2.2字

示例:

.at:匹配以任意字符開頭,后面為at的字符串,如“cat”、“bat”、“#at”等。

[a-z]:匹配任意一個小寫字母(a~z之間的),如“a”、“c”、“e”等。

[aeiou]:匹配任意一個元音字母。

[a-zA-Z]:匹配任意一個大寫或小寫字母。

[^a-z]:匹配任何不在a~z之間的字符。

2.重復(fù)

正則表達式中用于確定重復(fù)次數(shù)的字符如表2.3所示。

表2.3重

復(fù)

數(shù)

示例:

[a-zA-Z]*:匹配由任意大小寫字母構(gòu)成的字符串,也可以是空字符串,如“abc”。

[0-9]+:匹配任何由數(shù)字構(gòu)成的字符串,該字符串至少包含一個字符,如“1234”。

[a-z0-9]?:匹配空字符串,或者一個小寫字母或數(shù)字。

3.子表達式

正則表達式中子表達式的格式和作用如表2.4所示。

表2.4子

示例:

(very)*large:匹配“l(fā)arge”、“verylarge”、“veryverylarge”等。注意very后面的空格。

4.子表達式計數(shù)

正則表達式中的子表達式可以出現(xiàn)多次,子表達式的計數(shù)如表2.5所示。

表2.5子表達式計數(shù)

示例:

(very){1}:匹配“very”。

(very){1,3}:匹配“very”、“veryvery”、“veryveryvery”。

(very){1,}:匹配由一個或一個以上“very”構(gòu)成的字符串。

5.指定字符串的開始和結(jié)尾

正則表達式中字符串的開始和結(jié)束符如表2.6所示。

表2.6開

結(jié)

6.分支

正則表達式中表示分支的字符如表2.7所示。

表2.7分

示例:

com|edu|net:匹配com、edu或net。

7.匹配特殊字符

在匹配特殊字符的時候需要用到轉(zhuǎn)義字符,如表2.8所示。

表2.8特

示例:

\\:匹配一個反斜杠。

\.:匹配一個圓點。

下面舉例說明一些常見用法:

^[a-zA-Z][a-zA-Z0-9_]*$:匹配以字母開頭,由字母、數(shù)字和下劃線組成的字符串,如“abc_123”。

^[a-zA-Z0-9]{6,}$:匹配由字母和數(shù)字組成、長度不少于6位的字符串,如“123456”。

^[0-9]{4}-[0-9]{2}-[0-9]{2}$:匹配格式為“xxxx-xx-xx”的字符串,要求x只能是數(shù)字。常用于匹配日期,如“2007-05-01”。

^[a-zA-Z][a-zA-Z0-9_\-]*@([a-zA-Z0-9\-]+\.)+[a-z]{2,3}$:常用于匹配E-mail。要求@符號前面是以字母開頭,由字母、數(shù)字、下劃線或減號組成的字符串;@符號后面的域名可以包含多個字符串,每個字符串由字母、數(shù)字或減號組成;最后一級域名只能包含2個或3個字母(例如cn、com等)。

^0[0-9]{2,3}-[0-9]{7,8}$:常用于匹配電話號碼。要求區(qū)號由0開始,包含3到4位數(shù)字,區(qū)號和電話號碼之間用減號分隔,電話號碼由7位或者8位數(shù)字組成。

下面的例子展示了如何在JavaScript中使用正則表達式,其功能是對電話號碼格式進行驗證:

functionisPhone(str)

{

if(str.match("^0[0-9]{2,3}-[0-9]{7,8}$"))

returntrue;

else

returnfalse;

} 2.5設(shè)置頁面的編碼方式

2.5.1實現(xiàn)代碼

每個JSP頁面都需要設(shè)置編碼方式,設(shè)置JSP頁面的編碼方式可以是下面兩種方式之一。

方式一:

<%@pagecontentType=“text/html;charset=GB2312”%>

方式二:

<%@pagepageEncoding="GB2312"%>

兩種方式基本相同,都是通過page指令的屬性完成的。方式一使用的是contentType屬性,方式二使用的是pageEncoding屬性。

另外,在屬性值中出現(xiàn)的“GB2312”是一種編碼方式。通常,中文的頁面可以采用兩種編碼方式:“GB2312”和“GBK”。

只要是用于顯示信息的JSP界面都應(yīng)該設(shè)置編碼方式,所以以后每個JSP文件不管顯示什么信息,首先要把上面的那一行

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負責。
  • 6. 下載文件中如有侵權(quán)或不適當內(nèi)容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論