電子商務(wù)網(wǎng)頁(yè)設(shè)計(jì)與網(wǎng)站建設(shè)-第五章 構(gòu)建交互式頁(yè)面

1、5 構(gòu)建交互式頁(yè)面5 構(gòu)建交互式頁(yè)面5.1 表單的使用5.2 高級(jí)表單技術(shù)5.1 表單的使用5.1.1 表單的基本概念5.1.2 插入表單對(duì)象實(shí)例：制作電子郵件表單5.1.1 表單的基本概念訪問(wèn)者可以使用文本域、列表框、復(fù)選框及單選按鈕之類的表單對(duì)象輸入信息，然后單擊某個(gè)按鈕提交這些信息5.1.2 插入表單對(duì)象創(chuàng)建表單執(zhí)行“插入記錄”中“表單”的“表單”命令頁(yè)面中出現(xiàn)一條紅色虛線，選中虛線，在“屬性”面板中設(shè)置表單名稱動(dòng)作：指定處理該表單的動(dòng)態(tài)頁(yè)或腳本的路徑方法：選擇將表單數(shù)據(jù)傳輸?shù)椒?wù)器的方式在“MIME”類型：選擇發(fā)送數(shù)據(jù)的MIME編碼類型插入單行文本域?qū)⒐鈽?biāo)置于表單內(nèi)，插入一個(gè)8行2列的

2、表格，在“屬性”面板中將“間距”和“邊距”分別設(shè)置為2，“背景顏色”設(shè)置為#B6D32B在第1行第1個(gè)單元格內(nèi)輸入“姓名”，在第2個(gè)單元格內(nèi)執(zhí)行“插入記錄”中“表單”的“文本域”命令選種文本域，在“屬性”面板中設(shè)置字符寬度：15類型：?jiǎn)涡胁迦朊艽a域?qū)⒐鈽?biāo)置于第2行第1個(gè)單元格內(nèi)，輸入“密碼”，在第2個(gè)單元格內(nèi)執(zhí)行“插入記錄”中“表單”的“文本域”命令選擇文本域，在“屬性”面板中設(shè)置字符寬度：15類型：密碼插入單選按鈕在第3行的第1個(gè)單元格中輸入“性別”，在第2個(gè)單元格中執(zhí)行“插入記錄”中“表單”的“單選按鈕”命令，插入單選按鈕，在按鈕后面輸入“男”選擇按鈕，在“屬性”面板中設(shè)置初始狀態(tài)：未選中

3、以同樣方法插入一個(gè)單選按鈕，在按鈕后面輸入“女”，選中按鈕，在“屬性”面板中設(shè)置初始狀態(tài)：已勾選插入復(fù)選框在第4行第1個(gè)單元格內(nèi)輸入“愛(ài)好”，在第2個(gè)單元格中執(zhí)行“插入記錄”的“表單”中“復(fù)選框”命令，插入復(fù)選框，在復(fù)選框后面輸入“上網(wǎng)”選中復(fù)選框，在“屬性”面板中設(shè)置復(fù)選框名稱：aihao按上述方法添加其他愛(ài)好插入列表和菜單在第5行的第1個(gè)單元格內(nèi)輸入“類別”，在第2個(gè)單元格內(nèi)執(zhí)行“插入記錄”的“表單”的“列表/菜單”命令，插入列表/菜單在“屬性”面板中設(shè)置列表/菜單：select類型：菜單列表值：“我想進(jìn)一步了解產(chǎn)品情況”“我想和貴公司合作”“不訂貨，只是留言”插入多行文本域在第6行第1個(gè)

4、單元格中輸入“其他說(shuō)明”，在第7行的第2個(gè)單元格中執(zhí)行“插入記錄”的“表單”的“文本區(qū)域”命令在“屬性”面板中設(shè)置字符寬度：48行數(shù)：8類型：多行初始值：“在這里寫(xiě)其他要求”插入表單按鈕在第8行的第2個(gè)單元格內(nèi)執(zhí)行“插入記錄”的“表單”的“按鈕”命令在“屬性”面板中設(shè)置動(dòng)作：提交表單值：提交按上述方法再插入一個(gè)按鈕，在“屬性”中設(shè)置動(dòng)作：重置表單值：重置實(shí)例：制作電子郵件表單在選定位置插入表單表單中插入10行2列的表格，“居中對(duì)齊”第1行中輸入“您的名稱”插入“字符寬度”為25，“最多字符數(shù)”為100，“類型”為單行的文本域按照同樣要求，分別在2-6行中輸入“您的地址”、“郵政編碼”、“您的網(wǎng)

5、址”、“您的email”和“您的電話”以及對(duì)應(yīng)的文本域在第7行的第1個(gè)單元格內(nèi)輸入“經(jīng)營(yíng)模式”，在第2個(gè)單元格內(nèi)插入單選按鈕在第8行第1個(gè)單元格內(nèi)輸入“您的要求”，在第9行第2個(gè)單元格內(nèi)插入“字符寬度”為45、“行數(shù)”為6行、“類型”為多行的文本區(qū)域在第10行第2個(gè)單元格內(nèi)插入“提交”、“重置”2個(gè)按鈕5.2 高級(jí)表單技術(shù)數(shù)據(jù)合法性檢驗(yàn)姓名、年齡、內(nèi)容等不能為空Email地址必須合法點(diǎn)擊“常用”工具條上的“腳本”按鈕在彈出的窗口中設(shè)置：語(yǔ)言：test/javascript內(nèi)容：輸入如下代碼function test(form1) if(.value=) alert(請(qǐng)輸入您的姓名); .focus(); else if(form1.shuoming.value.indexOf(,0)=-1) alert(說(shuō)明不正確，請(qǐng)重新輸入); else form1.submit(); 點(diǎn)擊確定，在文檔窗口中出現(xiàn)腳本圖標(biāo)選中“提交”按鈕，在“行為”面板中將起動(dòng)作改為“無(wú)”點(diǎn)擊“行為”面板中的“+”按鈕，在彈出的菜單中選擇“調(diào)用JavaScript”在彈出的“調(diào)用JavaScri