【文章內(nèi)容簡介】 nytext用戶填寫工作單位workareselect用戶選擇工作地區(qū)phonetext用戶填寫聯(lián)系電話etimeselect用戶選擇入學(xué)年份workonselect用戶選擇工作領(lǐng)域qqtext用戶填寫用戶submitsubmit注冊(cè)提交表單在注冊(cè)功能的前臺(tái)驗(yàn)證中使用了JavaScript技術(shù)，這樣做的好處在于用戶不用真正提交注冊(cè)信息就可以得知注冊(cè)信息的合法性。不僅如此，在此功能的實(shí)現(xiàn)上我采用了更加靈活的顯示方式。效果如圖62所示。圖62 系統(tǒng)注冊(cè)驗(yàn)證頁面如圖所示用戶所填寫的注冊(cè)信息合法性會(huì)實(shí)時(shí)地顯示在頁面的右部。在這里采用的是JavaScript和正則表達(dá)式相結(jié)合的方法，使用正則表達(dá)式可以更準(zhǔn)確的驗(yàn)證數(shù)據(jù)，同時(shí)可以屏蔽非法字符。Ajax技術(shù)是當(dāng)下流行的WEB技術(shù)，主要無刷的數(shù)據(jù)提交。Ajax使用XML傳輸數(shù)據(jù)、異步JavaScript解析XMLDocument對(duì)象、服務(wù)器回傳數(shù)據(jù)不重繪頁面，它可以與任何服務(wù)器技術(shù)進(jìn)行交互。Ajax是典型的客戶端技術(shù)，所以要使用Ajax還需要了解HTML、DOM、CSS和JavaScript，以及熟悉JavaScript的即時(shí)測試和JavaScript的瀏覽器版本測試。我在注冊(cè)功能中使用Ajax技術(shù)實(shí)現(xiàn)了用戶賬號(hào)是否存在的無刷驗(yàn)證。Ajax驗(yàn)證的頁面調(diào)用代碼如下：input type=text name=userid id=userid onblur=UserCheck(,39。txtHint39。)。=39。input_onBlur39。autoplete=off /Ajax的功能實(shí)現(xiàn)核心代碼：//向服務(wù)器發(fā)送驗(yàn)證請(qǐng)求if(!objRequestamp。amp。typeof XMLHttpRequest!=undefined) {objRequest=new XMLHttpRequest()。}var url=?action=Isregamp。name=+escape(name)。 if(objRequest!=null) { = nameProcess。 (get,url,true)。 (ContentType, text/xml。charset=GB2312)。 (null)。 }}功能演示如圖63和圖64所示。圖63 系統(tǒng)注冊(cè)頁面Ajax使用1圖64 系統(tǒng)注冊(cè)頁面Ajax使用2。所謂后臺(tái)數(shù)據(jù)驗(yàn)證就是注冊(cè)信息被提交給服務(wù)器后在寫入數(shù)據(jù)庫之前的最后一次驗(yàn)證。因?yàn)镴avaScript 客戶端解釋語言，在客戶端用戶可以通過設(shè)置自己的瀏覽器屬性來關(guān)閉瀏覽器對(duì)JavaScript的支持，這樣一來前臺(tái)驗(yàn)證寫的再嚴(yán)謹(jǐn)也無用武之地，而此時(shí)使用服務(wù)器端腳本語言VBScript 編寫的后臺(tái)數(shù)據(jù)驗(yàn)證就顯得尤其重要。如圖65為注冊(cè)成功頁面。圖65 系統(tǒng)注冊(cè)成功頁面根據(jù)系統(tǒng)設(shè)計(jì)階段的設(shè)計(jì)信息平臺(tái)具有四個(gè)主要功能：發(fā)布信息、發(fā)表回復(fù)、查找信息、瀏覽信息。實(shí)現(xiàn)的主要功能為：進(jìn)行信息驗(yàn)證，通過驗(yàn)證后方可寫入數(shù)據(jù)庫。圖66為校友之家網(wǎng)站系統(tǒng)的發(fā)布信息頁面。用戶通過表單提供信息內(nèi)容，系統(tǒng)對(duì)用戶提供的信息進(jìn)行驗(yàn)證，如果合法，則將信息寫入數(shù)據(jù)庫，如果不合法則提示錯(cuò)誤信息。在這里值得提出的是對(duì)信息描述字?jǐn)?shù)限制的控制，我所采用的不是簡單的JavaScript驗(yàn)證，而是實(shí)時(shí)的字?jǐn)?shù)顯示和余下可數(shù)字?jǐn)?shù)的提醒。這個(gè)功能的實(shí)現(xiàn)使用的仍然是JavaScript的客戶端驗(yàn)證技術(shù)，但是在使用手法上卻更加成熟和靈活。實(shí)現(xiàn)這個(gè)功能的前臺(tái)層的布局和設(shè)置代碼如下：DIV class=case div class=demo gray textarea name=content id=content cols=65 rows=15 onfocus==39。input_onFocus39。 onblur==39。input_onBlur39。 maxlength=5000/textarea /div div class=gray最多可輸入span id=stat_max class=b light/span，當(dāng)前共span id=stat_total class=b light/span，還可輸入span id=stat_left class=b light/span/div /div圖66 系統(tǒng)發(fā)布信息頁面系統(tǒng)信息發(fā)布頁面使用了一個(gè)信息表(infoadd)。在系統(tǒng)信息發(fā)布頁面里使用這個(gè)表單采集信息。表62 信息表名稱表單元素類型Value值含義titleText用戶填寫信息標(biāo)題classnameSelect用戶選擇信息類別contentTextarea用戶填寫信息內(nèi)容daysSelect用戶選擇信息有效期adIframe用戶填寫上傳圖片submitSubmit提 交提交表單在添加信息的表單中也加入了JavaScript的前臺(tái)驗(yàn)證，在這里不再贅述。實(shí)現(xiàn)的主要功能為：根據(jù)查找依據(jù)合成SQL語句查找數(shù)據(jù)表。圖67為校友之家網(wǎng)站系統(tǒng)的信息查找頁面。用戶通過表單提供信息查找依據(jù)，系統(tǒng)根據(jù)用戶提供的查找依據(jù)合成SQL語句進(jìn)行數(shù)據(jù)查找。系統(tǒng)信息查找頁面使用了一個(gè)表單(infosearch)。在系統(tǒng)信息查找頁面里使用這個(gè)表單采集查找依據(jù)信息。圖67 系統(tǒng)信息查找頁面表63 信息查找表名稱表單元素類型Value值含義searchkeyText用戶填寫搜索關(guān)鍵字classnameSelect用戶選擇信息類別submitSubmit搜 索提交表單。實(shí)現(xiàn)的主要功能有：數(shù)據(jù)通過客戶端和服務(wù)器端驗(yàn)證后寫入數(shù)據(jù)庫。在發(fā)表回復(fù)頁面中用戶通過表單提供回復(fù)內(nèi)容，系統(tǒng)對(duì)回復(fù)內(nèi)容進(jìn)行驗(yàn)證，發(fā)表的回復(fù)內(nèi)容字符數(shù)不能超過300，校友在輸入回復(fù)的過程中系統(tǒng)會(huì)自動(dòng)提示已經(jīng)輸入的字符數(shù)與還可以輸入的字符數(shù)。在此頁面中使用的表單名為wb。表64 發(fā)表回復(fù)表名稱表單元素類型Value值含義contentTextarea用戶填寫回復(fù)內(nèi)容infoidHidden系統(tǒng)賦值信息IDsubmitSubmit發(fā)表留言提交表單圖68為校友之家網(wǎng)站的發(fā)表回復(fù)頁面：圖68 系統(tǒng)發(fā)表回復(fù)頁面在此功能上做了對(duì)留言的客戶端驗(yàn)證包括字?jǐn)?shù)限制等等，在服務(wù)器端做了同樣的工作，是留言內(nèi)容更加規(guī)整，更加合法。具體的實(shí)現(xiàn)方法和前幾個(gè)功能類似，在此不再贅述。此功能模塊尚存在的不足：沒有對(duì)留言進(jìn)行分頁顯示。此不足的存在原因是我在開發(fā)過程中的疏忽。我會(huì)盡快完善。校友分會(huì)的前臺(tái)不需要瀏覽信息的校友填寫任何信息，只需校友選擇要瀏覽的分會(huì)點(diǎn)擊進(jìn)去進(jìn)行瀏覽就可，這個(gè)模塊中顯然功能上要求不高，但要做的盡量人性化，方便校友進(jìn)行瀏覽、查閱。在這里導(dǎo)航的現(xiàn)實(shí)樣式就凸顯出了它功能上的優(yōu)越。在此功能模塊上值得注意的是各個(gè)校友分會(huì)的活動(dòng)剪影和各個(gè)分會(huì)的關(guān)聯(lián)。要實(shí)現(xiàn)這個(gè)功能就需要在數(shù)據(jù)庫中建立兩張表：分會(huì)信息表、活動(dòng)剪影表。而且分會(huì)信息表中的分會(huì)ID 應(yīng)該作為外鍵存儲(chǔ)在活動(dòng)剪影表內(nèi)。圖69為校友之家網(wǎng)站校友分會(huì)的導(dǎo)航：圖69 系統(tǒng)校友分會(huì)導(dǎo)航此處的導(dǎo)航功能是使用DIV+CSS設(shè)計(jì)，JavaScript語言實(shí)現(xiàn)的。網(wǎng)站功能的人性化程度是網(wǎng)站建設(shè)的一個(gè)軟性指標(biāo)，但是卻直接影響到整個(gè)網(wǎng)站在校友心目中的形象。在校友之家網(wǎng)站功能的人性化問題上我與校友辦的姚科長進(jìn)行了多次探討，在開發(fā)過程中姚科長的所提的意見讓我能夠更好地從校友們的角度去思考問題，去設(shè)計(jì)網(wǎng)站的功能。在校友之家網(wǎng)站各個(gè)功能的設(shè)計(jì)過程中我都盡量將人性化因素考慮在其中，因?yàn)榻?jīng)驗(yàn)和實(shí)力等因素我做的并不是很好。在設(shè)計(jì)中我認(rèn)真考慮了校友在瀏覽校友分會(huì)信息的便捷性，將點(diǎn)擊頻率較高的功能鍵盡量放在頁面中顯眼且容易被點(diǎn)擊到的地方，讓校友在使用本系統(tǒng)時(shí)有種得心應(yīng)手的感覺。當(dāng)然我所做的還遠(yuǎn)遠(yuǎn)不足。 圖610是校友分會(huì)信息的瀏覽頁面。圖610 系統(tǒng)校友分會(huì)瀏覽頁面圖611所示，頁面頂部已經(jīng)將所有分會(huì)信息羅列出來，如果校友想進(jìn)行校友分會(huì)間的跳轉(zhuǎn)瀏覽直接點(diǎn)擊就可以，而不需要再去導(dǎo)航中找相應(yīng)的分會(huì)鏈接。在分會(huì)活動(dòng)剪影中的快捷體驗(yàn)如圖611所示。圖611 系統(tǒng)校友分會(huì)活動(dòng)剪影頁面 圖611所示當(dāng)鼠標(biāo)放在頁面中“分會(huì)活動(dòng)”上時(shí)就會(huì)自動(dòng)彈出各個(gè)分會(huì)活動(dòng)剪影的鏈接。這樣就更方便校友對(duì)分會(huì)活動(dòng)剪影進(jìn)行瀏覽。網(wǎng)站的后臺(tái)用于管理網(wǎng)站的所有資源，安全性要求相對(duì)較高，而后臺(tái)的登陸模塊是整個(gè)后臺(tái)的門戶，除了做到后臺(tái)的安全隱藏以外還要做到后臺(tái)登陸驗(yàn)證的盡可能嚴(yán)謹(jǐn)。校友之家網(wǎng)站的后臺(tái)登陸頁面如圖612所示。圖612 系統(tǒng)后臺(tái)管理登陸頁面后臺(tái)登陸頁面所包含的驗(yàn)證有：客戶端JavaScript驗(yàn)證、服務(wù)器端驗(yàn)證、驗(yàn)證碼驗(yàn)證。運(yùn)行結(jié)果如圖613所示。圖613 系統(tǒng)后臺(tái)管理登陸判空驗(yàn)證如圖614為系統(tǒng)后臺(tái)登陸的報(bào)錯(cuò)頁面圖614 系統(tǒng)后臺(tái)管理登陸后臺(tái)驗(yàn)證報(bào)錯(cuò)如圖615為系統(tǒng)后臺(tái)登陸成功后的頁面圖615 系統(tǒng)后臺(tái)管理登陸登陸成功頁面普通管理員和超級(jí)管理員都可以對(duì)網(wǎng)站的注冊(cè)校友進(jìn)行管理?？梢赃M(jìn)行的操作有校友信息審核、校友鎖定、校友刪除、校友查詢。其中信息審核功能能夠很好地控制網(wǎng)站已經(jīng)注冊(cè)校友信息的真實(shí)性、有利于更好的維護(hù)校友之家網(wǎng)站秩序。圖616是校友管理功能的初始頁面。圖616 系統(tǒng)校友管理頁面如圖616中所示，為通過信息驗(yàn)證的校友會(huì)在頁面中直接顯示出來，而且被用紅色字樣特殊標(biāo)記出來。管理員只要點(diǎn)擊操作一欄中的“審核”就可以對(duì)校友進(jìn)行信息審核。此功能實(shí)現(xiàn)的代碼如下：% if trim(rs(ischeck))=0 then font color=red否/font else 是 end if % 值得提出的是在此頁面中還添加了發(fā)送站內(nèi)通知的快捷方式，點(diǎn)擊就可以直接對(duì)該校友發(fā)送站內(nèi)通知。此功能實(shí)現(xiàn)的代碼如下：a href=?UserID=%=rs(UserID)%amp。Username=%=rs(Username)% 發(fā)站內(nèi)通知/a圖617為校友信息的審核頁面，如圖所示，頁面中將注冊(cè)校友的所有信息都顯示了出來，管理員根據(jù)所添加的信息來判斷此條記錄是否有效。若發(fā)現(xiàn)校友信息明顯不屬實(shí)可以直接將此記錄刪除。圖617 系統(tǒng)校友信息審核頁面刪除快捷方式的實(shí)現(xiàn)代碼為：a href=?UserID=%=rsUser(UserID)%font color=FF0000strong刪除此用戶/strong/font/a信息若通過驗(yàn)證后屬實(shí)，管理員只需在是否通過驗(yàn)證一欄中選擇“予以通過”便可以通過該校友的注冊(cè)。此處的頁面邏輯控制代碼為：select name=ischeck option value=0%if trim(rsUser(ischeck))=0 then% selected=selected%end if%未曾通過/option option value=1%if trim(rsUser(ischeck))=1 then% selected=selected%end if%予以通過/option /select。7校友之家網(wǎng)站系統(tǒng)的測試與分析測試的目標(biāo)或定義：；；。除非是測試一個(gè)小程序，否則一開始就把整個(gè)系統(tǒng)作為一個(gè)單獨(dú)的實(shí)體來測試是不現(xiàn)實(shí)的。與開發(fā)過程類似，測試過程也必須分步驟進(jìn)行，每個(gè)步驟在邏輯上是前一個(gè)步驟的繼續(xù)。大型軟件系統(tǒng)通常由若干個(gè)子系統(tǒng)組成，每個(gè)子系統(tǒng)又有許多模塊組成。因此，大型軟件系統(tǒng)的測試基本上由下述幾個(gè)步驟組成：在設(shè)計(jì)得好的軟件系統(tǒng)中，每個(gè)模塊完成一個(gè)清晰定義的子功能，而且這個(gè)子系統(tǒng)和同級(jí)其他作為一個(gè)單獨(dú)的實(shí)體來測試，而且通常比較容易設(shè)計(jì)模塊正確性的測試方案。子系統(tǒng)測試是把經(jīng)過單元測試的模塊放在一起形成一個(gè)子系統(tǒng)來測試。模塊相互間的協(xié)調(diào)和通信是這個(gè)測試過程中的主要問題，因此這個(gè)步驟著重測試模塊的接口。系統(tǒng)測試是把經(jīng)過測試的子系統(tǒng)裝配成一個(gè)完整的系統(tǒng)來測試。驗(yàn)收測試的目的是驗(yàn)證系統(tǒng)確實(shí)能夠滿足用戶的需要，在這個(gè)測試步驟中發(fā)現(xiàn)的往往是系統(tǒng)需求說明書中的錯(cuò)誤。所謂平行運(yùn)行就是同時(shí)運(yùn)行新開發(fā)出來的系統(tǒng)和將被它取代的舊系統(tǒng)，以便比較新舊兩個(gè)系統(tǒng)的處理結(jié)果。對(duì)鹽城工學(xué)院校友之家網(wǎng)站系統(tǒng)的測試是比較復(fù)雜、繁瑣和機(jī)械的工作，因?yàn)檎f明書的篇幅有限，在此處只作簡單說明，不詳細(xì)列出測試過程。此系統(tǒng)所有調(diào)試在Windows XP操作系統(tǒng)下完成的。在注冊(cè)信息過程中輸入不合法的信息后在右列會(huì)立即顯示錯(cuò)誤信息提示。例如在賬號(hào)文本框內(nèi)輸入字符串“123”然后將焦點(diǎn)移開，在右列會(huì)立即顯示報(bào)錯(cuò)信息：“用戶名不合法”。在不修改的情況下點(diǎn)擊注冊(cè)按鈕系統(tǒng)會(huì)跳出警告框并終止注冊(cè)信息的提交。在發(fā)布信息頁面沒有將信息填寫完整就點(diǎn)擊發(fā)布，系統(tǒng)會(huì)自動(dòng)跳出警告框報(bào)錯(cuò)，并終止信息的發(fā)布。在填寫發(fā)布信息的內(nèi)容時(shí)校友會(huì)發(fā)現(xiàn)系統(tǒng)會(huì)實(shí)時(shí)反饋已經(jīng)輸入信息字符數(shù)和還可以輸入的字符數(shù)，當(dāng)輸入達(dá)到最大限制時(shí)就不可以繼續(xù)輸入。當(dāng)校友成功提交信息后會(huì)發(fā)現(xiàn)