HTML與XHTML權威指南之九:表單
<form>標簽:定義表單
action屬性:說明了接收和處理表單數據的應用程序的url。如,<form action="login.do">...</form>
enctype屬性:瀏覽器在把數據傳遞給服務器之前,會對表單的數據進行編碼。用enctype屬性可以改變編碼格式,目前的編碼格式:multipart/form-data和text/plain。
1.標準編碼:將表單值的空格轉換成+,非字母數字轉換成%,后跟該字符的ASCII碼的十六進制,并將多行中的換行符換成%OD%OA。
2.multipart/form-data編碼:比標準編碼更長,且只有<form>的method屬性為post時,才能使用這種編碼格式。
3.text/plain編碼:只有當需要把表單數據通過電子郵件傳輸時,才可以使用這種編碼格式。
method屬性:必需的,有post和get方法兩種。
1.post方法:首先,瀏覽器將與action屬性中指定的表單處理服務器建立聯系,然后按分段傳輸的方法將數據發送給服務器。
2.get方法:瀏覽器與表單處理服務器建立聯系后,直接在一個傳輸步驟中發送所有表單數據;瀏覽器會將數據直接附在表單的action url之后。
target屬性:將表單的結果重新指向另一個窗口。
事件屬性:onSubmit和onReset。
<input>標簽:在表單中創建輸入元素。
傳統的文本字段:type屬性設置為text。size和maxlength屬性控制輸入顯示框的長度。value屬性可以為字段設置一個默認值。
掩碼后的文本控件:瀏覽器采用掩碼文本的方式保存密碼和敏感字符信息。type屬性設置為password,就可以創建一個掩碼文本控件。
文件選擇控件:type屬性設置為file。accept屬性可約束瀏覽器允許用戶選擇的文件類型。如果要在表單中包括一個或多個文件選擇字段,必須把<form>的enctype屬性設置為mulitipart/form-data,并把method屬性設置為post。
復選框(checkbox):type屬性設置為checkbox。
單選按鈕(radio button):與復選框行為相似,但只能選擇其中一個值。type屬性設置為radio。name和value是必需的屬性,cheched屬性如果設置了值,表示該按鈕在開始就處在選中狀態。
提交按鈕:type屬性為submit,會啟動將數據提交給服務器的過程。
重置按鈕:type屬性為reset,清除或設置某些默認值。
隱藏字段:type屬性為hidden,是一種向表單中嵌入信息的方法。
<button>標簽:在表單中創建一個按鈕控件。
type屬性:定義按鈕的動作,submit,reset或button。
<textarea>標簽:在文本框里創建多行文本,提交表單后,瀏覽器將行中的文字收集起來,行間用"%OD%OA"分隔。
rows和cols屬性:設置可視矩形區域的維數。
wrap屬性:設置該屬性的值為physical,文本輸入區實行自動換行。
<select>標簽:創建單選或多選菜單。
multiple屬性:假如該屬性后,可以允許選擇多個選項。
size屬性:決定用戶一次可以看到多少個選項。
<option>標簽:定義一個<select>表單控件中的每個條目。其內容只能是純文本。
value屬性:為每個選項設置一個值。如果沒有設置該屬性,選項的值將被設置為<option>標簽的內容。
如,<option value=Dog>Dog ; <option>Dog 這兩者具有同樣的值。
selected屬性:可以預先選定一個或多個選項。
<optgroup>標簽:如果選項菜單非常長,可以有此標簽將一些相關的選項分組。只能在<select>標簽中使用此標簽。
<label>標簽:為表單元素創建標記。分顯式和隱式兩種,如,
<lable for="ssn">Social Security Number:</label>
<input type="text" name="Soc" id="ssn">
<lable>Date of birth:<input type="text" name="dofb"></label>
第一個是顯式,第二個是隱式。
創建有效的表單:
1 瀏覽器約束:確保表單能最大程度地幫助用戶正確輸入數據。充分為表單做說明,解釋如何填寫表單。
2 處理受限制的顯示:讓表單能自然滾動,避免太寬的輸入元素。
3 用戶界面考慮:輸入元素應該按照邏輯組別組織起來。
4 創建流動的表單:不要在詢問用戶姓名之前詢問地址信息。
posted on 2007-12-19 23:29
matthew 閱讀(447)
評論(0) 編輯 收藏 所屬分類:
腳本語言及頁面設計