HTML表單(form)用于采集和提交用戶輸入的信息。示例代碼如下:
<form action="abc.html" method="post/get">
<input type="text" name="username">
<input type="submit" value="提交">
</form>
action:當(dāng)提交表單時脊岳,發(fā)送表單數(shù)據(jù)到action的文件中。
method:表示提交表單信息的方式。method有兩個值:get和post。get方式是將表單提交的信息經(jīng)過編碼之后桑腮,通過URL發(fā)送(可以在地址欄中看到表單的提交信息);post方式是將表單的內(nèi)容通過http發(fā)送蛉幸,在地址欄里看不到表單的提交信息破讨。
HTML表單的常用控件
<input type="text"> 單行文本輸入框
單行文本框會允許用戶輸入一些簡短的單行信息。
<input type="password"> 密碼框
密碼輸入框表示用戶輸入信息不會顯示輸入內(nèi)容奕纫,而是用黑點(diǎn)表示提陶。
<input type="radio"> 單選按鈕
單選按鈕表示用戶在一組選項(xiàng)中只能選擇一個,name相同為一組匹层。
<input type="radio" name="sex" value = "男">男
<input type="radio" name="sex" value = "女">女
<input type="radio" name="sex" value = "女" checked>女
用checked表示已選的選項(xiàng)隙笆。
<input type="checkbox"> 復(fù)選框
復(fù)選框表示用戶在一組選項(xiàng)中可以選擇多個,name相同為一組又固。
<input type="checkbox" name="hobby" value ="read">讀書
<input type="checkbox" name="hobby" value ="study">學(xué)習(xí)
<input type="checkbox" name="hobby" value ="play">玩
<input type="checkbox" name="hobby" value ="read" checked>讀書
用checked表示已選的選項(xiàng)仲器。
<input type="file" accept="image/png"> 選擇文件
accept表示只能選擇該種類型的文件,其他類型都是不可選的仰冠。
<input type="image" src="http://images/icons/go.png"> 提交圖片
表示以圖片作為表單的提交按鈕,src表示圖片路徑蝶糯。
<input type="hidden"> 隱藏域
隱藏域:可以向后臺傳遞數(shù)據(jù)洋只,在后臺暫存數(shù)據(jù)。
<input type="button"> 普通按鈕
<input type="submit">提交按鈕
表示將表單里的信息提交給表單里action所指向的文件。
<input type="reset"> 重置按鈕
表示清空手動添加到表單的信息识虚。
select 下拉框
下拉框既可以做單選肢扯,又可以做復(fù)選。
<select name="hobby" >
<option value="read">讀書
<option value="study">學(xué)習(xí)
<option value="play">玩
如果要變成復(fù)選担锤,加muiltiple即可蔚晨。用戶用Ctrl來實(shí)現(xiàn)多選。
<select name="hobby" multiple>
用戶還可以用size屬性來改變下拉框(Select)的大小肛循。
textarea 多行文本輸入框
<textarea name="article" cols="10" rows="5"></textarea>
表示輸入多行文本信息铭腕,cols表示textarea的寬度,rows表示textarea的高度多糠。