網(wǎng)頁設(shè)計與Web編程pptchapter08_第1頁
網(wǎng)頁設(shè)計與Web編程pptchapter08_第2頁
網(wǎng)頁設(shè)計與Web編程pptchapter08_第3頁
網(wǎng)頁設(shè)計與Web編程pptchapter08_第4頁
網(wǎng)頁設(shè)計與Web編程pptchapter08_第5頁
已閱讀5頁,還剩47頁未讀 繼續(xù)免費閱讀

下載本文檔

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

文檔簡介

1、第八章第八章 表單及表單驗證表單及表單驗證 內(nèi)容提要內(nèi)容提要p創(chuàng)建創(chuàng)建HTML表單表單p插入表單元素插入表單元素p驗證驗證HTML表單表單p附加自定義表單附加自定義表單p插入具有輔助功能的表單元素插入具有輔助功能的表單元素表單和表單元素是動態(tài)網(wǎng)頁程序設(shè)計表單和表單元素是動態(tài)網(wǎng)頁程序設(shè)計的基礎(chǔ),用戶可以使用文本域、列表的基礎(chǔ),用戶可以使用文本域、列表框、復(fù)選框等表單元素輸入信息,然框、復(fù)選框等表單元素輸入信息,然后單擊提交按鈕,表單會將這些信息后單擊提交按鈕,表單會將這些信息發(fā)送到服務(wù)器,服務(wù)器中的服務(wù)器端發(fā)送到服務(wù)器,服務(wù)器中的服務(wù)器端腳本或應(yīng)用程序會對這些信息進(jìn)行處腳本或應(yīng)用程序會對這些信息

2、進(jìn)行處理,并向用戶返回處理結(jié)果理,并向用戶返回處理結(jié)果。創(chuàng)建創(chuàng)建HTML表單表單n插入表單在在Dreamweaver中打開頁面,將光標(biāo)定位到要插入表中打開頁面,將光標(biāo)定位到要插入表單的位置。單的位置。執(zhí)行下列操作之一,即可在指定位置插入表單:執(zhí)行下列操作之一,即可在指定位置插入表單:選擇選擇“插入記錄插入記錄”|“表單表單”|“表單表單”命令;命令;選擇選擇“插入插入”工具欄上的工具欄上的“表單表單”類別,然后單擊類別,然后單擊“表單表單”按鈕。按鈕。創(chuàng)建HTML表單在在“設(shè)計設(shè)計”視圖中,表單顯示為紅色的虛輪廓視圖中,表單顯示為紅色的虛輪廓線線注意:在一個頁面中可以包含多個表單,但不能在注意

3、:在一個頁面中可以包含多個表單,但不能在一個表單中插入另一個表單。一個表單中插入另一個表單。n設(shè)置表單屬性在在“文檔文檔”窗口中,單擊表單輪廓或?qū)⒉迦朦c放入表單窗口中,單擊表單輪廓或?qū)⒉迦朦c放入表單內(nèi)部。內(nèi)部。選擇選擇“窗口窗口”|“屬性屬性”命令,打開表單的命令,打開表單的“屬性屬性”面板。面板。在在“屬性屬性”面板上設(shè)置表單的各項屬性:面板上設(shè)置表單的各項屬性:在在“表單名稱表單名稱”文本框中,輸入標(biāo)識該表單的唯一名稱。文本框中,輸入標(biāo)識該表單的唯一名稱。命名表單后,就可以使用腳本語言來引用或控制該表單。命名表單后,就可以使用腳本語言來引用或控制該表單。在在“動作動作”文本框中,輸入處理表

4、單數(shù)據(jù)的頁面或腳本文本框中,輸入處理表單數(shù)據(jù)的頁面或腳本的路徑,或者單擊文件夾圖標(biāo)導(dǎo)航到相應(yīng)的頁面或腳本。的路徑,或者單擊文件夾圖標(biāo)導(dǎo)航到相應(yīng)的頁面或腳本。創(chuàng)建HTML表單在在“方法方法”下拉列表框中,選擇將表單數(shù)據(jù)傳輸?shù)椒吕斜砜蛑?,選擇將表單數(shù)據(jù)傳輸?shù)椒?wù)器的方法,有務(wù)器的方法,有“默認(rèn)默認(rèn)”、“GET”和和“POST”三個選三個選項,項,GET方法用來傳送少量數(shù)據(jù),方法用來傳送少量數(shù)據(jù),POST方法用來傳送方法用來傳送大量數(shù)據(jù)。大量數(shù)據(jù)。在在“目標(biāo)目標(biāo)”下拉列表框中,選擇顯示返回結(jié)果的瀏覽下拉列表框中,選擇顯示返回結(jié)果的瀏覽器窗口,有器窗口,有“_blank”、“_parent”、“_

5、self”和和“_top”四個選項,分別表示返回結(jié)果顯示在未命名的新窗口、四個選項,分別表示返回結(jié)果顯示在未命名的新窗口、顯示當(dāng)前文檔的窗口的父窗口、顯示當(dāng)前文檔的窗口顯示當(dāng)前文檔的窗口的父窗口、顯示當(dāng)前文檔的窗口和頂層窗口。和頂層窗口。在在“MIME類型類型”下拉列表框中,指定提交給服務(wù)器下拉列表框中,指定提交給服務(wù)器進(jìn)行處理的數(shù)據(jù)使用的進(jìn)行處理的數(shù)據(jù)使用的MIME編碼類型。默認(rèn)設(shè)置為編碼類型。默認(rèn)設(shè)置為“application/x-www-form-urlencode”,通常與,通常與 POST 方法一起使用。如果表單包含文件上傳域,則指定為方法一起使用。如果表單包含文件上傳域,則指定為“

6、multipart/form-data”類型。類型。創(chuàng)建HTML表單n表單元素 表單元素是允許用戶輸入數(shù)據(jù)的HTML元素對象。插入表單元素的步驟如下:將光標(biāo)置于表單中待插入表單元素的位置。將光標(biāo)置于表單中待插入表單元素的位置。執(zhí)行下列操作之一,即可在指定位置插入表單元素:執(zhí)行下列操作之一,即可在指定位置插入表單元素:選擇選擇“插入記錄插入記錄”|“表單表單”命令,在彈出的子菜單中命令,在彈出的子菜單中選擇相應(yīng)的表單元素命令;選擇相應(yīng)的表單元素命令;選擇選擇“插入插入”工具欄上的工具欄上的“表單表單”類別,單擊相應(yīng)的類別,單擊相應(yīng)的表單元素按鈕。表單元素按鈕。插入表單元素n插入文本域 文本域是可

7、在其中輸入各種文本的表單元素,文本可以單行、多行或密碼方式顯示。插入文本域的步驟如下:將光標(biāo)置于表單中待插入文本域的位置,選擇將光標(biāo)置于表單中待插入文本域的位置,選擇“插入插入記錄記錄”|“表單表單”命令,在彈出的子菜單中選擇命令,在彈出的子菜單中選擇“文本域文本域”命令,在表單中插入文本域。命令,在表單中插入文本域。選中文本域,打開相應(yīng)的選中文本域,打開相應(yīng)的“屬性屬性”面板面板。插入表單元素在在“屬性屬性”面板上設(shè)置文本域的各項屬性:面板上設(shè)置文本域的各項屬性:在在“文本域文本域”文本框中,輸入標(biāo)識該文本域的唯一名文本框中,輸入標(biāo)識該文本域的唯一名稱。稱。在在“字符寬度字符寬度”文本框中,

8、輸入文本域中最多可顯示文本框中,輸入文本域中最多可顯示的字符數(shù)。的字符數(shù)。在在“最多字符數(shù)最多字符數(shù)”文本框中,輸入文本域中最多可容文本框中,輸入文本域中最多可容納的字符數(shù)。納的字符數(shù)。在在“初始值初始值”文本框中,輸入在瀏覽器載入表單時文文本框中,輸入在瀏覽器載入表單時文本域中顯示的內(nèi)容。本域中顯示的內(nèi)容。在在“類型類型”單選按鈕組中,指定文本域為單行、多行單選按鈕組中,指定文本域為單行、多行還是密碼域。還是密碼域。插入表單元素n插入按鈕 使用按鈕可將表單數(shù)據(jù)提交到服務(wù)器,或者重置表單。用戶也可以為按鈕分配其他已經(jīng)在腳本中定義的處理任務(wù)。插入按鈕的步驟如下:將光標(biāo)置于表單中待插入按鈕的位置,

9、選擇將光標(biāo)置于表單中待插入按鈕的位置,選擇“插入記插入記錄錄”|“表單表單”命令,在彈出的子菜單中選擇命令,在彈出的子菜單中選擇“按鈕按鈕”命命令,在表單中插入按鈕。令,在表單中插入按鈕。選中按鈕,打開相應(yīng)的選中按鈕,打開相應(yīng)的“屬性屬性”面板面板。插入表單元素在在“屬性屬性”面板上設(shè)置按鈕的各項屬性:面板上設(shè)置按鈕的各項屬性:在在“按鈕名稱按鈕名稱”文本框中,輸入標(biāo)識該按鈕的唯一名文本框中,輸入標(biāo)識該按鈕的唯一名稱。稱。在在“值值”文本框中,輸入按鈕上顯示的文本。文本框中,輸入按鈕上顯示的文本。在在“動作動作”單選按鈕組中,指定單擊按鈕時發(fā)生的動單選按鈕組中,指定單擊按鈕時發(fā)生的動作。作。l

10、提交表單:創(chuàng)建提交按鈕,單擊該按鈕時提交表單:創(chuàng)建提交按鈕,單擊該按鈕時提交表單數(shù)據(jù)進(jìn)行處理,數(shù)據(jù)將被提交到提交表單數(shù)據(jù)進(jìn)行處理,數(shù)據(jù)將被提交到在表單的在表單的“動作動作”屬性中指定的頁面或腳屬性中指定的頁面或腳本。本。l重設(shè)表單:創(chuàng)建復(fù)位按鈕,單擊該按鈕時重設(shè)表單:創(chuàng)建復(fù)位按鈕,單擊該按鈕時將表單數(shù)據(jù)恢復(fù)為初始值。將表單數(shù)據(jù)恢復(fù)為初始值。l無:單擊該按鈕時,執(zhí)行指定的動作。無:單擊該按鈕時,執(zhí)行指定的動作。插入表單元素n插入復(fù)選框 復(fù)選框用于在一組選項中選擇多個選項。插入復(fù)選框的步驟如下:將光標(biāo)置于表單中待插入復(fù)選框的位置,選擇將光標(biāo)置于表單中待插入復(fù)選框的位置,選擇“插入插入記錄記錄”|“

11、表單表單”命令,在彈出的子菜單中選擇命令,在彈出的子菜單中選擇“復(fù)選框復(fù)選框”命令,在表單中插入復(fù)選框。命令,在表單中插入復(fù)選框。選中復(fù)選框,打開相應(yīng)的選中復(fù)選框,打開相應(yīng)的“屬性屬性”面板面板。插入表單元素在在“屬性屬性”面板上設(shè)置復(fù)選框的各項屬性:面板上設(shè)置復(fù)選框的各項屬性:在在“復(fù)選框名稱復(fù)選框名稱”文本框中,輸入標(biāo)識該復(fù)選框的唯文本框中,輸入標(biāo)識該復(fù)選框的唯一名稱。一名稱。在在“選定值選定值”文本框中,輸入復(fù)選框被選中時發(fā)送給文本框中,輸入復(fù)選框被選中時發(fā)送給服務(wù)器的值。服務(wù)器的值。在在“初始狀態(tài)初始狀態(tài)”單選按鈕組中,指定瀏覽器載入表單單選按鈕組中,指定瀏覽器載入表單時復(fù)選框是否處于

12、選中狀態(tài)。時復(fù)選框是否處于選中狀態(tài)。插入表單元素n插入單選按鈕 單選按鈕用于在一組選項中選擇一個選項。單選按鈕通常成組使用,同組中的所有單選按鈕必須具有相同的名稱。逐個插入單選按鈕逐個插入單選按鈕將光標(biāo)置于表單中待插入單選按鈕的位置,選擇將光標(biāo)置于表單中待插入單選按鈕的位置,選擇“插插入記錄入記錄”|“表單表單”命令,在彈出的子菜單中選擇命令,在彈出的子菜單中選擇“單選單選按鈕按鈕”命令,在表單中插入單選按鈕。命令,在表單中插入單選按鈕。選中單選按鈕,打開相應(yīng)的選中單選按鈕,打開相應(yīng)的“屬性屬性”面板。面板。插入表單元素在在“屬性屬性”面板上設(shè)置單選按鈕的各項屬性:面板上設(shè)置單選按鈕的各項屬性

13、:l在在“單選按鈕單選按鈕”文本框中,輸入單選按鈕文本框中,輸入單選按鈕的名稱,同組單選按鈕必須具有相同的名的名稱,同組單選按鈕必須具有相同的名稱。稱。l在在“選定值選定值”文本框中,輸入單選按鈕被文本框中,輸入單選按鈕被選中時發(fā)送給服務(wù)器的值。選中時發(fā)送給服務(wù)器的值。l在在“初始狀態(tài)初始狀態(tài)”單選按鈕組中,指定瀏覽單選按鈕組中,指定瀏覽器載入表單時單選按鈕是否處于選中狀態(tài)。器載入表單時單選按鈕是否處于選中狀態(tài)。插入單選按鈕組插入單選按鈕組將光標(biāo)置于表單中待插入單選按鈕組的位置,選擇將光標(biāo)置于表單中待插入單選按鈕組的位置,選擇“插入記錄插入記錄”|“表單表單”命令,在彈出的子菜單中選擇命令,在

14、彈出的子菜單中選擇“單選按鈕組單選按鈕組”命令,打開命令,打開“單選按鈕組單選按鈕組”對話框。對話框。插入表單元素設(shè)置“單選按鈕組”對話框的各項屬性:l在在“名稱名稱”文本框中,輸入單選按鈕組的名稱。文本框中,輸入單選按鈕組的名稱。l單擊單擊“+”或或“-”按鈕,在組中添加或刪除單選按鈕;單擊按鈕,在組中添加或刪除單選按鈕;單擊“”或或“”按鈕,向上或向下移動組中選定的單選按鈕,向上或向下移動組中選定的單選按鈕。按鈕。l單擊單擊“標(biāo)簽標(biāo)簽”列的選項,設(shè)置單選按鈕的提示信息;單列的選項,設(shè)置單選按鈕的提示信息;單擊擊“值值”列的選項,設(shè)置單選按鈕被選中時發(fā)送給服務(wù)列的選項,設(shè)置單選按鈕被選中時發(fā)

15、送給服務(wù)器的值。器的值。l在在“布局,使用:布局,使用:”單選按鈕組中選擇單選按鈕組的布單選按鈕組中選擇單選按鈕組的布局方式。局方式。插入表單元素n插入列表/菜單 列表以滾動方式顯示多個選項,允許用戶在其中選擇一個或多個選項。菜單以下拉方式顯示多個選項,只允許用戶在其中選擇一個選項。插入列表/菜單的步驟如下:將光標(biāo)置于表單中待插入列表將光標(biāo)置于表單中待插入列表/菜單的位置,選擇菜單的位置,選擇“插插入記錄入記錄”|“表單表單”命令,在彈出的子菜單中選擇命令,在彈出的子菜單中選擇“列表列表/菜單菜單”命令,在表單中插入列表命令,在表單中插入列表/菜單。菜單。選中列表選中列表/菜單,打開相應(yīng)的菜單

16、,打開相應(yīng)的“屬性屬性”面板。面板。插入表單元素在在“屬性屬性”面板上設(shè)置列表面板上設(shè)置列表/菜單的各項屬性:菜單的各項屬性:在在“列表列表/菜單菜單”文本框中,輸入標(biāo)識該列表文本框中,輸入標(biāo)識該列表/菜單的唯菜單的唯一名稱。一名稱。單擊單擊“列表值列表值”按鈕,打開按鈕,打開“列表值列表值”對話框。對話框。l單擊單擊“+”或或“-”按鈕,在列表按鈕,在列表/菜單中添加菜單中添加或刪除選項;單擊或刪除選項;單擊“”或或“”按鈕,按鈕,向上或向下移動列表向上或向下移動列表/菜單中選定的選項。菜單中選定的選項。插入表單元素l“項目標(biāo)簽項目標(biāo)簽”和和“值值”列分別顯示了不同選列分別顯示了不同選項的標(biāo)

17、簽和被選中時發(fā)送給服務(wù)器的值,可項的標(biāo)簽和被選中時發(fā)送給服務(wù)器的值,可單擊相應(yīng)的文本,在出現(xiàn)的方框中輸入新的單擊相應(yīng)的文本,在出現(xiàn)的方框中輸入新的標(biāo)簽和值。標(biāo)簽和值。選擇選擇“初始化時選定初始化時選定”列表框中的某項,該項將成為列表框中的某項,該項將成為瀏覽器載入表單時列表瀏覽器載入表單時列表/菜單中默認(rèn)選中的選項。菜單中默認(rèn)選中的選項。在在“類型類型”單選按鈕組中單擊單選按鈕組中單擊“列表列表”單選按鈕,打單選按鈕,打開相應(yīng)的開相應(yīng)的“屬性屬性”面板。在面板。在“高度高度”文本框中輸入列文本框中輸入列表中顯示的選項數(shù),如果輸入的數(shù)字小于列表實際包表中顯示的選項數(shù),如果輸入的數(shù)字小于列表實際包

18、含的選項數(shù),則出現(xiàn)滾動條。在含的選項數(shù),則出現(xiàn)滾動條。在“允許多選允許多選”復(fù)選框復(fù)選框中指定是否允許用戶在列表中同時選擇多個選項中指定是否允許用戶在列表中同時選擇多個選項(按下按下Ctrl或或Shift鍵鍵)。插入表單元素n插入文件域 文件域使用戶可以選擇本地計算機(jī)上不同類型的文件,并將該文件上傳到服務(wù)器。在插入文件域之前,需要將表單的“方法”屬性設(shè)置為“POST”,“MIME類型”屬性設(shè)置為“multipart/form-data”,“動作”屬性設(shè)置為服務(wù)器端腳本或能夠處理上傳文件的頁面。插入文件域的步驟如下:將光標(biāo)置于表單中待插入文件域的位置,選擇將光標(biāo)置于表單中待插入文件域的位置,選擇

19、“插入插入記錄記錄”|“表單表單”命令,在彈出的子菜單中選擇命令,在彈出的子菜單中選擇“文件域文件域”命令,在表單中插入文件域。命令,在表單中插入文件域。插入表單元素選中文件域,打開相應(yīng)的選中文件域,打開相應(yīng)的“屬性屬性”面板。面板。在在“屬性屬性”面板上設(shè)置文件域的各項屬性:面板上設(shè)置文件域的各項屬性:在在“文件域名稱文件域名稱”文本框中,輸入標(biāo)識該文件域的唯文本框中,輸入標(biāo)識該文件域的唯一名稱。一名稱。在在“字符寬度字符寬度”文本框中,輸入文件域中最多可顯示文本框中,輸入文件域中最多可顯示的字符數(shù)。的字符數(shù)。在在“最多字符數(shù)最多字符數(shù)”文本框中,輸入文件域中最多可容文本框中,輸入文件域中最

20、多可容納的字符數(shù)。如果通過納的字符數(shù)。如果通過“瀏覽瀏覽”按鈕來定位文件,則按鈕來定位文件,則文件名和路徑可超過文件名和路徑可超過“最多字符數(shù)最多字符數(shù)”指定的值。指定的值。插入表單元素n插入圖像域 圖像域用于生成圖形化按鈕。插入圖像域的步驟如下:將光標(biāo)置于表單中待插入圖像域的位置,選擇將光標(biāo)置于表單中待插入圖像域的位置,選擇“插入插入記錄記錄”|“表單表單”命令,在彈出的子菜單中選擇命令,在彈出的子菜單中選擇“圖像域圖像域”命令,打開命令,打開“選擇圖像源文件選擇圖像源文件”對話框。對話框。在對話框中定位圖像域的源文件,單擊在對話框中定位圖像域的源文件,單擊“確定確定”按鈕,按鈕,即可在表單

21、中插入圖像域。即可在表單中插入圖像域。選中圖像域,打開相應(yīng)的選中圖像域,打開相應(yīng)的“屬性屬性”面板。面板。插入表單元素在在“屬性屬性”面板上設(shè)置圖像域的各項屬性:面板上設(shè)置圖像域的各項屬性:在在“圖像區(qū)域圖像區(qū)域”文本框中,輸入標(biāo)識該圖像域的唯一文本框中,輸入標(biāo)識該圖像域的唯一名稱。名稱。在在“源文件源文件”文本框中,輸入圖像源文件的路徑和名文本框中,輸入圖像源文件的路徑和名稱,或者單擊文件夾圖標(biāo)導(dǎo)航到相應(yīng)的源文件。稱,或者單擊文件夾圖標(biāo)導(dǎo)航到相應(yīng)的源文件。在在“替換替換”文本框中,輸入描述性文本,一旦圖像在文本框中,輸入描述性文本,一旦圖像在瀏覽器中載入失敗,將顯示這些文本。瀏覽器中載入失敗

22、,將顯示這些文本。在在“對齊對齊”下拉列表框中,設(shè)置圖像域的對齊屬性。下拉列表框中,設(shè)置圖像域的對齊屬性。單擊單擊“編輯圖像編輯圖像”按鈕,啟動默認(rèn)的圖像編輯器并打按鈕,啟動默認(rèn)的圖像編輯器并打開圖像源文件以待編輯。開圖像源文件以待編輯。默認(rèn)情況下,單擊圖像域時會將表單數(shù)據(jù)發(fā)送到服務(wù)默認(rèn)情況下,單擊圖像域時會將表單數(shù)據(jù)發(fā)送到服務(wù)器,功能類似于提交按鈕。也可以將某種行為或自定器,功能類似于提交按鈕。也可以將某種行為或自定義腳本附加到圖像域上,實現(xiàn)特定的功能。義腳本附加到圖像域上,實現(xiàn)特定的功能。插入表單元素n插入隱藏域 隱藏域是一種在頁面上不顯示的表單元素,可用來存儲隱私信息。插入隱藏域的步驟如

23、下:將光標(biāo)置于表單中待插入隱藏域的位置,選擇將光標(biāo)置于表單中待插入隱藏域的位置,選擇“插入插入記錄記錄”|“表單表單”命令,在彈出的子菜單中選擇命令,在彈出的子菜單中選擇“隱藏域隱藏域”命令,在表單中插入隱藏域。命令,在表單中插入隱藏域。選中隱藏域,打開相應(yīng)的選中隱藏域,打開相應(yīng)的“屬性屬性”面板。面板。在在“屬性屬性”面板上設(shè)置隱藏域的各項屬性:面板上設(shè)置隱藏域的各項屬性:在在“隱藏區(qū)域隱藏區(qū)域”文本框中,輸入標(biāo)識該隱藏域的唯一文本框中,輸入標(biāo)識該隱藏域的唯一名稱。名稱。在在“值值”文本框中,輸入提交表單時發(fā)送給服務(wù)器的文本框中,輸入提交表單時發(fā)送給服務(wù)器的數(shù)據(jù)。數(shù)據(jù)。插入表單元素n插入跳轉(zhuǎn)

24、菜單 跳轉(zhuǎn)菜單中的每個選項都與URL關(guān)聯(lián),當(dāng)用戶選擇某個選項時,會重定向到關(guān)聯(lián)的URL。插入跳轉(zhuǎn)菜單的步驟如下:將光標(biāo)置于表單中待插入跳轉(zhuǎn)菜單的位置,選擇將光標(biāo)置于表單中待插入跳轉(zhuǎn)菜單的位置,選擇“插插入記錄入記錄”|“表單表單”命令,在彈出的子菜單中選擇命令,在彈出的子菜單中選擇“跳轉(zhuǎn)跳轉(zhuǎn)菜單菜單”命令,打開命令,打開“插入跳轉(zhuǎn)菜單插入跳轉(zhuǎn)菜單”對話框。對話框。插入表單元素設(shè)置設(shè)置“插入跳轉(zhuǎn)菜單插入跳轉(zhuǎn)菜單”對話框的各項屬性:對話框的各項屬性:單擊單擊“+”或或“-”按鈕,在按鈕,在“菜單項菜單項”列表框中添加或列表框中添加或刪除選項;單擊刪除選項;單擊“”或或“”按鈕,向上或向下移按鈕,向

25、上或向下移動動“菜單項菜單項”列表框中選定的選項。列表框中選定的選項。在在“文本文本”文本框中,輸入當(dāng)前選項的顯示文本。如文本框中,輸入當(dāng)前選項的顯示文本。如果希望菜單包含選擇提示,可在此處輸入提示文本并果希望菜單包含選擇提示,可在此處輸入提示文本并使其成為第一個選項使其成為第一個選項在在“選擇時,轉(zhuǎn)到選擇時,轉(zhuǎn)到URL”文本框中,輸入與當(dāng)前選項關(guān)文本框中,輸入與當(dāng)前選項關(guān)聯(lián)的聯(lián)的URL。在在“打開打開URL于于”下拉列表框中,選擇目標(biāo)文件的打下拉列表框中,選擇目標(biāo)文件的打開位置。開位置。在在“菜單菜單ID”文本框中,輸入跳轉(zhuǎn)菜單的文本框中,輸入跳轉(zhuǎn)菜單的id屬性值。屬性值。插入表單元素如果沒

26、有使用選擇提示,選擇如果沒有使用選擇提示,選擇“菜單之后插入前往按菜單之后插入前往按鈕鈕”復(fù)選框,在跳轉(zhuǎn)菜單旁添加一個復(fù)選框,在跳轉(zhuǎn)菜單旁添加一個“前往前往”接鈕。接鈕。如果使用了選擇提示,選擇如果使用了選擇提示,選擇“更改更改URL后選擇第一個后選擇第一個項目項目”復(fù)選框。復(fù)選框。單擊單擊“插入跳轉(zhuǎn)菜單插入跳轉(zhuǎn)菜單”對話框的對話框的“確定確定”按鈕,添加按鈕,添加的選項顯示在的選項顯示在“屬性屬性”面板的面板的“初始化時選定初始化時選定”列表列表框中,選擇列表框中的某項,該項將成為瀏覽器載入框中,選擇列表框中的某項,該項將成為瀏覽器載入表單時跳轉(zhuǎn)菜單中默認(rèn)選中的選項。表單時跳轉(zhuǎn)菜單中默認(rèn)選中

27、的選項。插入表單元素n插入字段集 字段集用于對表單元素進(jìn)行分組,通過將相關(guān)聯(lián)的元素分組,可以使用戶更容易明白它們的用途。插入字段集的步驟如下:將光標(biāo)置于表單中待插入字段集的位置,選擇將光標(biāo)置于表單中待插入字段集的位置,選擇“插入插入記錄記錄”|“表單表單”命令,在彈出的子菜單中選擇命令,在彈出的子菜單中選擇“字段集字段集”命令,打開命令,打開“字段集字段集”對話框。對話框。在對話框的在對話框的“標(biāo)簽標(biāo)簽”文本框中輸入字段集的標(biāo)題,單文本框中輸入字段集的標(biāo)題,單擊擊“確定確定”按鈕。按鈕。插入表單元素在字段集中插入相關(guān)聯(lián)的表單元素。在字段集中插入相關(guān)聯(lián)的表單元素。插入表單元素n插入標(biāo)簽 標(biāo)簽用來

28、將表單元素與其說明信息相關(guān)聯(lián),增加表單元素的可訪問性。插入標(biāo)簽的步驟如下:將光標(biāo)置于表單中待插入標(biāo)簽的位置,選擇將光標(biāo)置于表單中待插入標(biāo)簽的位置,選擇“插入記插入記錄錄”|“表單表單”命令,在彈出的子菜單中選擇命令,在彈出的子菜單中選擇“標(biāo)簽標(biāo)簽”命命令,在表單中插入標(biāo)簽,切換至令,在表單中插入標(biāo)簽,切換至“代碼代碼”視圖,可以視圖,可以發(fā)現(xiàn)表單中增加了一對發(fā)現(xiàn)表單中增加了一對標(biāo)簽。標(biāo)簽。在在與與標(biāo)簽對之間輸入表單元素的文本說標(biāo)簽對之間輸入表單元素的文本說明,并在表單中插入相應(yīng)的表單元素。明,并在表單中插入相應(yīng)的表單元素。 例如:例如:運(yùn)動插入表單元素設(shè)置設(shè)置label標(biāo)簽的屬性:標(biāo)簽的屬性:

29、for屬性:指定屬性:指定標(biāo)簽要關(guān)聯(lián)的表單元素,屬性標(biāo)簽要關(guān)聯(lián)的表單元素,屬性值設(shè)置為表單元素的值設(shè)置為表單元素的id值。設(shè)置了值。設(shè)置了for屬性后,單擊屬性后,單擊標(biāo)簽中的文本說明,所關(guān)聯(lián)的表單元素將獲標(biāo)簽中的文本說明,所關(guān)聯(lián)的表單元素將獲得焦點。得焦點。accesskey屬性:指定訪問屬性:指定訪問標(biāo)簽所關(guān)聯(lián)的表單標(biāo)簽所關(guān)聯(lián)的表單元素的快捷鍵。設(shè)置了元素的快捷鍵。設(shè)置了accesskey屬性后,按下屬性后,按下【Alt+accesskey屬性值】屬性值】/【Alt+Shift+accesskey屬性屬性值】值】組合鍵,所關(guān)聯(lián)的表單元素將獲得焦點。組合鍵,所關(guān)聯(lián)的表單元素將獲得焦點。插入表

30、單元素nSpry框架 Spry框架是一個用來構(gòu)建更加豐富的Web頁的JavaScript和CSS庫,它支持一組用標(biāo)準(zhǔn)HTML、CSS和JavaScript編寫的可重用構(gòu)件,其中每個構(gòu)件都與唯一的CSS和JavaScript文件相關(guān)聯(lián)。CSS文件包含設(shè)置構(gòu)件樣式所需的全部信息,而JavaScript文件則賦予構(gòu)件功能。當(dāng)使用Dreamweaver插入構(gòu)件時,Dreamweaver會自動將這些文件鏈接到當(dāng)前頁面,并且在站點的SpryAssets文件夾中保存相應(yīng)的JavaScript和CSS文件。驗證HTML表單 Spry構(gòu)件的基本操作包括:插入插入Spry構(gòu)件:選擇構(gòu)件:選擇“插入插入”|“Spr

31、y”命令,在彈出的命令,在彈出的子菜單中選擇相應(yīng)的構(gòu)件命令,子菜單中選擇相應(yīng)的構(gòu)件命令,Dreamweaver會在保存會在保存頁面時自動在站點的頁面時自動在站點的SpryAssets文件夾中包括所需的文件夾中包括所需的JavaScript和和CSS文件。文件。選擇選擇Spry構(gòu)件:首先將光標(biāo)停留在構(gòu)件上,直到出現(xiàn)構(gòu)構(gòu)件:首先將光標(biāo)停留在構(gòu)件上,直到出現(xiàn)構(gòu)件的藍(lán)色選項卡式輪廓;然后單擊構(gòu)件左上角的選項卡件的藍(lán)色選項卡式輪廓;然后單擊構(gòu)件左上角的選項卡標(biāo)簽。標(biāo)簽。編輯編輯Spry構(gòu)件:選擇要編輯的構(gòu)件,在構(gòu)件:選擇要編輯的構(gòu)件,在“屬性屬性”面板中面板中進(jìn)行屬性設(shè)置。進(jìn)行屬性設(shè)置。設(shè)置設(shè)置Spry

32、構(gòu)件樣式:找到與構(gòu)件相對應(yīng)的構(gòu)件樣式:找到與構(gòu)件相對應(yīng)的CSS文件,根文件,根據(jù)實際需求進(jìn)行編輯。也可以通過據(jù)實際需求進(jìn)行編輯。也可以通過“CSS樣式樣式”面板來面板來設(shè)置設(shè)置Spry構(gòu)件的樣式。構(gòu)件的樣式。驗證HTML表單更改默認(rèn)的更改默認(rèn)的Spry資源文件夾:首先選擇資源文件夾:首先選擇“站點站點”|“管理管理站點站點”命令,在命令,在“管理站點管理站點”對話框中選擇相應(yīng)站點并對話框中選擇相應(yīng)站點并單擊單擊“編輯編輯”按鈕;在按鈕;在“站點定義站點定義”對話框中選擇對話框中選擇“高高級級”選項卡;在選項卡;在“分類分類”列表框中選擇列表框中選擇“Spry”選項,選項,在在“Spry資源文件

33、夾資源文件夾”文本框中輸入目標(biāo)文件夾的路徑,文本框中輸入目標(biāo)文件夾的路徑,或單擊文件夾圖標(biāo)瀏覽到指定位置?;騿螕粑募A圖標(biāo)瀏覽到指定位置。驗證HTML表單n使用驗證文本域 Spry驗證文本域構(gòu)件用于在訪問者輸入文本時顯示文本的狀態(tài)(有效或無效)。插入驗證文本域的步驟如下:將光標(biāo)置于表單中待插入驗證文本域的位置,選擇將光標(biāo)置于表單中待插入驗證文本域的位置,選擇“插入記錄插入記錄”|“表單表單”命令,在彈出的子菜單中選擇命令,在彈出的子菜單中選擇“Spry驗證文本域驗證文本域”命令,在表單中插入驗證文本域。命令,在表單中插入驗證文本域。驗證HTML表單選中驗證文本域,打開相應(yīng)的選中驗證文本域,打開

34、相應(yīng)的“屬性屬性”面板。面板。在在“屬性屬性”面板上設(shè)置驗證文本域的各項屬性:面板上設(shè)置驗證文本域的各項屬性:在在“Spry文本域文本域”文本框中,輸入標(biāo)識該驗證文本域的唯文本框中,輸入標(biāo)識該驗證文本域的唯一名稱。一名稱。在在“類型類型”和和“格式格式”下拉列表框中,指定驗證類型及格下拉列表框中,指定驗證類型及格式,參考教材式,參考教材P224的表的表8-1。驗證HTML表單在在“驗證于驗證于”單選按鈕組中,指定驗證發(fā)生的時間。單選按鈕組中,指定驗證發(fā)生的時間。lonBlur:當(dāng)用戶在文本域的外部單擊時驗證。:當(dāng)用戶在文本域的外部單擊時驗證。lonChange:當(dāng)用戶更改文本域中的文本時驗證。

35、:當(dāng)用戶更改文本域中的文本時驗證。lonSubmit:當(dāng)用戶提交表單時驗證。:當(dāng)用戶提交表單時驗證。當(dāng)驗證類型為當(dāng)驗證類型為“無無”、“整數(shù)整數(shù)”、“電子郵件地址電子郵件地址”和和“URL”時,可在時,可在“最小字符數(shù)最小字符數(shù)”和和“最大字符數(shù)最大字符數(shù)”文本文本框中輸入數(shù)值,指定文本域中允許輸入的最小和最大字符框中輸入數(shù)值,指定文本域中允許輸入的最小和最大字符數(shù)。數(shù)。當(dāng)驗證類型為當(dāng)驗證類型為“整數(shù)整數(shù)”、“時間時間”、“貨幣貨幣”和和“實數(shù)實數(shù)/科科學(xué)記數(shù)法學(xué)記數(shù)法”時,可在時,可在“最小值最小值”和和“最大值最大值”文本框中輸文本框中輸入數(shù)值,指定文本域中允許輸入的最小和最大值。入數(shù)值,

36、指定文本域中允許輸入的最小和最大值。驗證HTML表單在在“預(yù)覽狀態(tài)預(yù)覽狀態(tài)”下拉列表框中,選擇要查看的狀態(tài)。驗證下拉列表框中,選擇要查看的狀態(tài)。驗證文本域構(gòu)件具有多種狀態(tài),參考教材文本域構(gòu)件具有多種狀態(tài),參考教材P225的表的表8-2。在在“提示提示”文本框中,輸入文本域的格式提示信息,當(dāng)瀏文本框中,輸入文本域的格式提示信息,當(dāng)瀏覽器載入頁面時,這些提示信息將顯示在文本域中。覽器載入頁面時,這些提示信息將顯示在文本域中。選中選中“必需的必需的”復(fù)選框,表示驗證文本域中必須包含輸入復(fù)選框,表示驗證文本域中必須包含輸入內(nèi)容。內(nèi)容。選中選中“強(qiáng)制模式強(qiáng)制模式”復(fù)選框,可以禁止用戶在驗證文本域中復(fù)選框

37、,可以禁止用戶在驗證文本域中輸入無效字符。輸入無效字符。驗證HTML表單n使用驗證文本區(qū)域 Spry驗證文本區(qū)域構(gòu)件用于在訪問者輸入多行文本時顯示文本的狀態(tài)(有效或無效)。插入驗證文本區(qū)域的步驟如下:將光標(biāo)置于表單中待插入驗證文本區(qū)域的位置,選擇將光標(biāo)置于表單中待插入驗證文本區(qū)域的位置,選擇“插入記錄插入記錄”|“表單表單”命令,在彈出的子菜單中選擇命令,在彈出的子菜單中選擇“Spry驗證文本區(qū)域驗證文本區(qū)域”命令,在表單中插入驗證文本命令,在表單中插入驗證文本區(qū)域。區(qū)域。驗證HTML表單選中驗證文本區(qū)域,打開相應(yīng)的選中驗證文本區(qū)域,打開相應(yīng)的“屬性屬性”面板。面板。在在“屬性屬性”面板上設(shè)置

38、驗證文本區(qū)域的各項屬性:面板上設(shè)置驗證文本區(qū)域的各項屬性:在在“Spry文本區(qū)域文本區(qū)域”文本框中,輸入標(biāo)識該驗證文本區(qū)域文本框中,輸入標(biāo)識該驗證文本區(qū)域的唯一名稱。的唯一名稱。在在“計數(shù)器計數(shù)器”單選按鈕組中,選擇是否添加字符計數(shù)器。單選按鈕組中,選擇是否添加字符計數(shù)器。選中選中“禁止額外字符禁止額外字符”復(fù)選框,防止用戶在驗證文本區(qū)域復(fù)選框,防止用戶在驗證文本區(qū)域中輸入的文本超過所允許的最大字符數(shù)。中輸入的文本超過所允許的最大字符數(shù)。其余各項屬性的含義和功能與驗證文本域的相關(guān)屬性類似。其余各項屬性的含義和功能與驗證文本域的相關(guān)屬性類似。驗證HTML表單n使用驗證復(fù)選框 Spry驗證復(fù)選框構(gòu)

39、件包含一個或一組復(fù)選框,根據(jù)用戶的選擇顯示無效或有效狀態(tài)。插入驗證復(fù)選框構(gòu)件的步驟如下:將光標(biāo)置于表單中待插入驗證復(fù)選框構(gòu)件的位置,選將光標(biāo)置于表單中待插入驗證復(fù)選框構(gòu)件的位置,選擇擇“插入記錄插入記錄”|“表單表單”命令,在彈出的子菜單中選擇命令,在彈出的子菜單中選擇“Spry驗證復(fù)選框驗證復(fù)選框”命令,在表單中插入驗證復(fù)選框命令,在表單中插入驗證復(fù)選框構(gòu)件。構(gòu)件。 如果希望驗證復(fù)選框構(gòu)件包含一組復(fù)選框,可將插入如果希望驗證復(fù)選框構(gòu)件包含一組復(fù)選框,可將插入點放置在藍(lán)色選項卡式輪廓內(nèi)、已插入復(fù)選框的右側(cè),點放置在藍(lán)色選項卡式輪廓內(nèi)、已插入復(fù)選框的右側(cè),然后選擇然后選擇“插入記錄插入記錄”|“

40、表單表單”命令,在彈出的子菜單命令,在彈出的子菜單中選擇中選擇“復(fù)選框復(fù)選框”命令,在驗證復(fù)選框構(gòu)件中放置多命令,在驗證復(fù)選框構(gòu)件中放置多個復(fù)選框。個復(fù)選框。驗證HTML表單選中驗證復(fù)選框構(gòu)件,打開相應(yīng)的選中驗證復(fù)選框構(gòu)件,打開相應(yīng)的“屬性屬性”面板。面板。在在“屬性屬性”面板上設(shè)置驗證復(fù)選框構(gòu)件的各項屬性:面板上設(shè)置驗證復(fù)選框構(gòu)件的各項屬性:在在“Spry復(fù)選框復(fù)選框”文本框中,輸入標(biāo)識該驗證復(fù)選框構(gòu)件文本框中,輸入標(biāo)識該驗證復(fù)選框構(gòu)件的唯一名稱。的唯一名稱。如果驗證復(fù)選框構(gòu)件僅包含單個復(fù)選框,可選中如果驗證復(fù)選框構(gòu)件僅包含單個復(fù)選框,可選中“必需必需(單單個個)”單選按鈕,表示復(fù)選框必須被

41、選中。單選按鈕,表示復(fù)選框必須被選中。如果驗證復(fù)選框構(gòu)件包含一組復(fù)選框,可選中如果驗證復(fù)選框構(gòu)件包含一組復(fù)選框,可選中“強(qiáng)制范圍強(qiáng)制范圍(多個復(fù)選框多個復(fù)選框)”單選按鈕,然后在單選按鈕,然后在“最小選擇數(shù)最小選擇數(shù)”文本框中文本框中輸入希望用戶選中的最小復(fù)選框數(shù),在輸入希望用戶選中的最小復(fù)選框數(shù),在“最大選擇數(shù)最大選擇數(shù)”文文本框中輸入希望用戶選中的最大復(fù)選框數(shù)。本框中輸入希望用戶選中的最大復(fù)選框數(shù)。驗證HTML表單在在“實施范圍實施范圍(多個多個)”下拉列表框中,選擇要查看的狀態(tài)。下拉列表框中,選擇要查看的狀態(tài)。如果驗證復(fù)選框構(gòu)件僅包含單個復(fù)選框,則可查看的狀態(tài)如果驗證復(fù)選框構(gòu)件僅包含單個

42、復(fù)選框,則可查看的狀態(tài)為為“初始初始”和和“必填必填”;如果驗證復(fù)選框構(gòu)件包含一組復(fù);如果驗證復(fù)選框構(gòu)件包含一組復(fù)選框,并設(shè)置了最小選擇數(shù)和最大選擇數(shù),則可查看的狀選框,并設(shè)置了最小選擇數(shù)和最大選擇數(shù),則可查看的狀態(tài)為態(tài)為“初始初始”、“未達(dá)到最小選擇數(shù)未達(dá)到最小選擇數(shù)”和和“已超過最大選已超過最大選擇數(shù)擇數(shù)”。在在“驗證于驗證于”單選按鈕組中,指定驗證發(fā)生的時間。單選按鈕組中,指定驗證發(fā)生的時間。l onBlur:當(dāng)用戶在驗證復(fù)選框構(gòu)件的外部單擊:當(dāng)用戶在驗證復(fù)選框構(gòu)件的外部單擊時驗證。時驗證。l onChange:當(dāng)用戶進(jìn)行選擇時驗證。:當(dāng)用戶進(jìn)行選擇時驗證。l onSubmit:當(dāng)用戶提

43、交表單時驗證。:當(dāng)用戶提交表單時驗證。驗證HTML表單n使用驗證選擇 Spry驗證選擇構(gòu)件是一個下拉菜單,在用戶進(jìn)行選擇時顯示有效或無效狀態(tài)。插入驗證復(fù)選框構(gòu)件的步驟如下:將光標(biāo)置于表單中待插入驗證選擇構(gòu)件的位置,選擇將光標(biāo)置于表單中待插入驗證選擇構(gòu)件的位置,選擇“插入記錄插入記錄”|“表單表單”命令,在彈出的子菜單中選擇命令,在彈出的子菜單中選擇“Spry驗證選擇驗證選擇”命令,在表單中插入驗證選擇構(gòu)件。命令,在表單中插入驗證選擇構(gòu)件。選中驗證選擇構(gòu)件,打開相應(yīng)的選中驗證選擇構(gòu)件,打開相應(yīng)的“屬性屬性”面板面板。驗證HTML表單在在“屬性屬性”面板上設(shè)置驗證選擇構(gòu)件的各項屬性:面板上設(shè)置驗證

44、選擇構(gòu)件的各項屬性:在在“Spry選擇選擇”文本框中,輸入標(biāo)識該驗證選擇構(gòu)件的唯文本框中,輸入標(biāo)識該驗證選擇構(gòu)件的唯一名稱。一名稱。在在“不允許不允許”復(fù)選框組中,指定是否允許選擇空值選項或復(fù)選框組中,指定是否允許選擇空值選項或無效值選項。無效值選項。l空值:選中此復(fù)選框表示禁止在驗證選擇構(gòu)件空值:選中此復(fù)選框表示禁止在驗證選擇構(gòu)件中選擇空值選項。中選擇空值選項。l無效值:選中此復(fù)選框后,可在其后的文本框無效值:選中此復(fù)選框后,可在其后的文本框中輸入具體的無效數(shù)值,當(dāng)用戶選擇具有該無中輸入具體的無效數(shù)值,當(dāng)用戶選擇具有該無效值的選項時,構(gòu)件將返回錯誤提示消息。效值的選項時,構(gòu)件將返回錯誤提示消息。在在“預(yù)覽狀態(tài)預(yù)覽狀態(tài)”下拉列表框中,選擇要查看的狀態(tài)。下拉列表框中,選擇要查看的狀態(tài)。在在“驗證于驗證于”單選按鈕組中,指定驗證發(fā)生的時間。單選按鈕組中,指定驗證發(fā)生的時間。驗證HTML表單可以將自定義的腳本代碼附加到表單或表單元素上,以便產(chǎn)生特定的響應(yīng)。在表單或表單元素上

溫馨提示

  • 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)方式做保護(hù)處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

最新文檔

評論

0/150

提交評論