【文章內(nèi)容簡介】 圖 產(chǎn)品主類別表 圖 產(chǎn)品子類別表 圖 訂單表 圖 訂單產(chǎn)品表 圖 用戶表 圖 新聞表 上面設(shè)計(jì)的數(shù)據(jù)表可以應(yīng)用于龐大的網(wǎng)上購物系統(tǒng)。 9 3 首頁的設(shè)計(jì) 數(shù)據(jù)庫連接 用 ASP 開發(fā)的網(wǎng)站，習(xí)慣上通過 這個(gè)頁面來實(shí)現(xiàn)網(wǎng)站數(shù)據(jù)庫的連接。頁面比較簡單，就是設(shè)置數(shù)據(jù)庫連接的基本命令，程序說明如下： % connstr=DBQ=+(/mdb/)+。//設(shè)置 DBO服務(wù)器物理路徑 DefaultDir=。DRIVER={Microsoft Access Driver (*.mdb)}。//定義為 ACCESS數(shù)據(jù)庫 set conn=()//設(shè)置為 ADODB連接 connstr//打開數(shù)據(jù)庫 % 注冊及搜索功能的制作 網(wǎng)上購物系統(tǒng)需要有一個(gè)購物流程來引導(dǎo)用戶在網(wǎng)上實(shí)現(xiàn)訂購，一般都是通過用戶自身登陸、瀏覽、訂購、結(jié)算這樣的流程來實(shí)現(xiàn)網(wǎng)上購物的，同時(shí)需要加入搜索功能以方便用戶在網(wǎng)上直接進(jìn)行 搜索訂購，所以我在首頁的導(dǎo)航欄建立了用戶登陸系統(tǒng)，購物車及搜索功能。由功能出發(fā)分別設(shè)計(jì)各功能模塊： ? 首先分析核心部分 —— 購物車系統(tǒng)。 完成后的設(shè)計(jì)效果如圖 3. 1 所示。該購物車系統(tǒng)重要有實(shí)現(xiàn)寫入用戶名，統(tǒng)計(jì)購物車的商品，統(tǒng)計(jì)商品總價(jià)值，請空購物車，連接到結(jié)算功能頁面這幾個(gè)主要的小功能。 圖 完成的購物車用戶系統(tǒng) ? 此段程序如下所示： trtd colspan=2marquee onMouseOver=stop()。 onMouseOut=start()。 direction=left scrollamount=4img src=image/ width=19 height=19 % if session(MM_username) then (session(MM_username)) else (游客 ) end if % //如果用戶登陸了則顯示用戶名，如果沒有登陸則顯示游客 ，歡迎你！購物車中共有 /spanspan class=STYLE1 % if session(all_number)= then %0 % else %%=session(all_number)% 10 % end if %件商品總價(jià)值 /spanspan class=STYLE1 //統(tǒng)計(jì)商品的總數(shù)量 % if session(all_price)= then % 0 % else %%=session(all_price)% % end if %元 //統(tǒng)計(jì)商品總價(jià)值 % if session(all_number)= then %span class=STYLE2strong 清 空 購 物 車/strong / strong去結(jié)算 /strong/span % else % a href=../shopping/ //調(diào)用 頁面功能來實(shí)現(xiàn)清空購物車 strong清空購物車 /strong/a / a href=../shopping/strong去結(jié)算 /strong/a //調(diào)用 % end if % img src=image/ width=19 height=19 /marquee/td/tr ? 接著購物車系統(tǒng)的下面是用戶注冊、登陸系統(tǒng)及密碼找回 3 個(gè)模塊 。 設(shè)計(jì) 效果圖如下圖 3. 2所示。此 3 個(gè)模塊可以統(tǒng)稱為 用戶管理系統(tǒng)，用戶管理系統(tǒng)的網(wǎng)頁及網(wǎng)頁結(jié) 構(gòu)列表如圖 所示。 圖 效果圖 用戶管理系統(tǒng) ↓ ↙ ↓ ↘ 用戶登陸模塊 注冊頁面 找回密碼模塊 ↙ ↘ ↓ ↓ ↓ ↓ ↓ 圖 用戶管理系統(tǒng)網(wǎng)頁結(jié)構(gòu)列表 （ 一 ） 用戶登陸模塊的設(shè)計(jì) （ 1） 利用 Dreamweaver8 對 前臺(tái) 進(jìn)行 設(shè)計(jì) ，效果 如圖 所示。 然后 利用工具向網(wǎng)頁添加“登陸用戶”的服務(wù)器行為，具體步驟如下： 打開“服務(wù)器行為”面板→單擊該面板上 按鈕，執(zhí)行菜單“用戶身份驗(yàn)證” |“登陸用 11 戶”命令。此時(shí)，打開“登陸用戶”對話框，各項(xiàng)參數(shù)設(shè)置如圖 所示。 （ 2） 登陸失敗 則轉(zhuǎn)入 頁面 。 （ 3） 登陸成功后仍為 頁面，但用戶名稱已經(jīng)成功寫入購物車。 （ 二 ） 用戶注冊模塊的設(shè)計(jì) （ 1） 頁面主要實(shí)現(xiàn)用戶注冊的功能，用戶注冊的操作就是向 數(shù)據(jù)庫的用戶表中添加記錄的操作，頁面設(shè)計(jì)效果如圖 所示 （ 2） 注冊失敗則在 頁面上有相關(guān)提示 代碼， 重新注冊。 （ 3） 注冊成功則轉(zhuǎn)到 頁面，進(jìn)行登陸。 （三） 密碼查詢模塊的設(shè)計(jì) （ 1） 頁面是用來讓用戶提交查詢遺失密碼的 用戶名的頁面。 （ 2） 當(dāng)用戶在 頁面中輸入用戶名，并單擊“提交”后，這時(shí)會(huì)通過表單將用戶名提交到 頁面中，該頁面的作用就是根據(jù)用戶名從數(shù)據(jù)庫中找到對應(yīng)的記錄的提示問題并顯示在 頁面中， 輸入答案，服務(wù)器就把用戶名和密碼提示問題答案提交到 頁面中。 圖 各項(xiàng)參數(shù)設(shè)置 圖 ? 搜索功能的設(shè)計(jì)與制作主要是通過 SQL 的查詢語句來實(shí)現(xiàn)的，設(shè)計(jì)效果如圖 所示 圖 搜索功能 具體功能程序代碼如下 ： form name=FromSearch method=post action=product/ onSubmit=return check()//提交后由 td width=493h5 % set rs_class=() sql=select * from 產(chǎn)品主類別 order by 主類別 ID 12 sql,conn,1,1 % //建立 SQL查詢語句，通過商品主類別及主類別 ID來查詢商品數(shù)據(jù)庫 img src=image/ width=13 height=12商品搜索 :關(guān)鍵字 input name=search_key type=text class=input1 size=10 //設(shè)置搜索關(guān)鍵詞文本域 類別 select name=search_class class=input1 option value= selected所有產(chǎn)品類別 /option %for i=1 to % option value=%=rs_class(主類別 ID)%%=rs_class(主類別名稱 )%/option % if then exit for end if next 39。把記錄集游標(biāo)移到第一條記錄 % /select//通過商品主類別 ID 和主類別名稱進(jìn)行分類查詢 input name=imageField2 type=image src=image/ width=45 height=20 /h5/td/form 導(dǎo)航條 導(dǎo)航條是附著在背景圖片上的設(shè)計(jì)，設(shè)計(jì)效果如圖 所示。 圖 導(dǎo)航條 在首頁制作中，需要說 明的是熱銷商品模塊的代碼比較簡單，大部分是靜態(tài)代碼，主要是放入購物車 （“購買”按鈕） 功能，即調(diào)用 頁面，在第五章會(huì)詳細(xì)介紹。 13 4 商品動(dòng)態(tài)頁面的設(shè)計(jì) 商品羅列頁面 單擊導(dǎo)航條中的“采購中心”或單擊首頁“商品分類”中的任意商品內(nèi)容可以連接到此頁面，主要是用來顯示數(shù)據(jù)庫中的所有商品。設(shè)計(jì)效果如圖 所示。 圖 采購中心頁面 主要部分 主要相關(guān)代碼如下： % for i=1 to %tr//設(shè)置記錄集計(jì)算循環(huán) td width=430strong %=rs(主類別名稱 )%/strong/td //顯示主類別名稱 td width=142 height=30h5strong a href= class=STYLE2返回總分類 /a/strong /h5/td/tr trtd height=40 colspan=3font size=2 color=000000 % for j=1 to if then end if if CInt(rs_sub(主類別 ID))=CInt(rs(主類別 ID)) then % a href=?sub_classID=%=rs_sub(子類別 ID)%amp。name=%=rs_sub(子類別名稱 )%%=rs_sub(子類別名稱 )%/a % end if next %/font/tr //該段程序是在頁面中顯示子類別名稱的代碼 % next % 商品細(xì)節(jié)頁面的制作 商品細(xì)節(jié)頁面 要能顯示商品的所有詳細(xì)信息，包括商品價(jià)格、商品產(chǎn)地、商品圖片等，同時(shí)要顯示是否在架（是否還有商品）以及放入購物車等功能。設(shè)計(jì)效果如 14 圖 所示。 圖 商品詳細(xì)頁面 主 要部分 具體相關(guān)代碼如下： table width=100% height=40 border=1 cellpadding=3 cellspacing=0 bordercolor=FFCCCC trtd width=228 height=38h5商品編碼： %=rs(商品編碼 )%/h5/td td width=219 % if rs(在架狀態(tài) )=0 then else % a href=../shopping/?productID=%=rs(產(chǎn)品 ID)% img src=../image/ width=103 height=31 border=0 //a % end if %/tdtd width=233h5 //如果商品在架，單擊放入購物車鏈接 。 % if rs(在架狀態(tài) )=0 then % span class=STYLE1抱歉！此商品缺貨！ /span % else % span class=STYLE1在架 /span % end if %/h5/td /tr /table //如果商品在架狀態(tài)定義值為 0，則顯示“抱歉！此商品缺貨！” table width=100% height=331 border=1 cellpadding=3 cellspacing=0 bordercolor=FFCCCCtrtd width=23 height=20 img src=../image/ width=19 height=12 //td td width=665商品名稱： %=rs(商品名稱 )%/td/trtrtd height=21//顯示商品名稱 img src=../image/ width=19 height=12 / /tdtd品牌： %=rs(品牌 )%/td/trtrtd height=21//顯示商品品牌 img src=../image/ width=19 height=12 / /td td單位： %=rs(單位 )%/td/trtrtd height=21//顯示商品 單位 img src=../image/ width=19 height=12 / /td