表單
表單的作用
收集頁(yè)面上用戶填寫(xiě)的信息,用戶提交表單時(shí)向服務(wù)器傳輸數(shù)據(jù),從而實(shí)現(xiàn)用戶與web服務(wù)器的交互。
表單定義及屬性
HTML表單是包含表單元素的區(qū)域,表單使用<form>標(biāo)簽創(chuàng)建,form標(biāo)簽是塊級(jí)元素。
action:提交的地址或者服務(wù)器,后臺(tái)代碼會(huì)根據(jù)這個(gè)地址進(jìn)行處理,為空或者不寫(xiě),表示提交到當(dāng)前頁(yè)面
method:定義瀏覽器將表單中的數(shù)據(jù)傳遞給服務(wù)器的方式,取值最常用的是GET/POST
target:在何處打開(kāi)action,常見(jiàn)值:_blank在新窗口中打開(kāi),_self相同的框架中打開(kāi)(默認(rèn)),_parent在父框架中打開(kāi),_top在新窗口中打開(kāi),_framename指定的框架中打開(kāi)
enctype:編碼方式,默認(rèn)值:application/x-www-form-urlencoded,包含文件上傳控件時(shí)multipart/form-data
name:表單名稱
表單元素
input標(biāo)簽
<input type="text" name="username" />/*主要屬性:size指定文本框的寬度,以字符個(gè)數(shù)為單位,大多數(shù)瀏覽器缺省時(shí)為20;value指默認(rèn)值;maxlength用戶輸入的最大字符長(zhǎng)度;readonly只讀屬性;disabled禁用,不能獲取焦點(diǎn),不能修改,不能提交*/
<input type="password" name="password" /> /*文件顯示為圓點(diǎn)*/
<input type="checkbox" name="color" value="red" />紅色
<input type="checkbox" name="color" value="yellow" />黃色
<input type="checkbox" name="color" value="blue" />藍(lán)色
<input type="radio" name="sex" value="male" />男性
<input type="radio" name="sex" value="female" />女性
<input type="file" accept="image/gif" />/*使用file時(shí),form的enctype屬性必須為multipart/form-data,method為post*/
<input type="hidden" name="ccc" value="123" /> /*隱藏域*/
<input type="submit" /> /*提交按鈕*/
<input type="reset" />/*重置按鈕*/
<input type="button" />/*普通按鈕*/
select標(biāo)簽,下拉列表 value="-1"表示不選擇,加上multiple屬性表示允許多選(按Ctrl鍵)
<select name="color">
<option value="red">紅色</option>
<option value="yellow">黃色</option>
<option value="blue" selected>藍(lán)色</option>
</select>
textarea標(biāo)簽,多行文本
<textarea name="article" cols="30" rows="60"></textarea>
label文本,點(diǎn)擊文本時(shí)input會(huì)獲取焦點(diǎn),for表示所要修飾的控件ID
<label for="username"></label>