<form action="http://wichkelysmart.com/hfhtmlcss/contest.php" method="post"></form>

表單的所有內(nèi)容都包含在form標(biāo)簽中? action屬性中的內(nèi)容將表單提交的的數(shù)據(jù)交給wichkelysmart.com鏈接內(nèi)的hftmlcss文件夾中的contest.php服務(wù)器腳本處理
所使用的方法是post

1:<input type="text" name="1" value="value控制文本框內(nèi)初始化的值"> 2:<input type="submit" name="2" value="提交按鈕由value設(shè)置">
3:女性：<input name="3" type="radio" value="選擇1">不男不女：<input type="radio" name="3" value="復(fù)選中的value是傳遞給服務(wù)器的值"><br><br><br> 4:蘋果<input type="checkbox" name="4" value="復(fù)選1">草莓<input type="checkbox" name="4" value="復(fù)選中的value是傳遞給服務(wù)器的值">香蕉<input type="checkbox" name="4" value="復(fù)選3">

Type確定是什么類型的控件，瀏覽器會(huì)把name當(dāng)做標(biāo)簽把收集到的數(shù)據(jù)發(fā)送到服務(wù)器，這樣服務(wù)器才能區(qū)分誰是誰

例如如果在一個(gè)名字為“zip”的text<input>元素中輸入了郵政編碼90050，表單提交時(shí)就會(huì)把“zip=90050”發(fā)送到服務(wù)器(HEAD FIRST HTML第677頁練習(xí))

注意name要與后臺(tái)腳本文檔代碼中的一致，在使用別人編寫的一個(gè)服務(wù)器腳本時(shí)，他必須告訴我要使用哪些元素名

復(fù)選框?yàn)g覽器會(huì)發(fā)送“4=香蕉&蘋果&草莓”到服務(wù)器

無需知道像服務(wù)器發(fā)送數(shù)據(jù)的后臺(tái)細(xì)節(jié) 但是需要知道服務(wù)器腳本期望得到的表單元素的名字和類型

與后臺(tái)的交互式通過URL進(jìn)行的 表單里的數(shù)據(jù)通過URL與后臺(tái)腳本進(jìn)行數(shù)據(jù)傳輸（代碼要相互呼應(yīng)——即表單名字和類型）

瀏覽器向服務(wù)器傳送收集到得數(shù)據(jù)——用表單

瀏覽器處理服務(wù)器傳回的數(shù)據(jù)——用ajax

表單發(fā)送給服務(wù)器的數(shù)據(jù)與name value和text文本框中的內(nèi)容相關(guān)

text：文本框，input默認(rèn)的type，不寫就是這個(gè)，value表示文本框里的值。
password：密碼框，value表示密碼框里的值。
submit：提交按鈕，value表示按鈕上的文字
button：普通按鈕，value表示按鈕上的文字
reset：重置按鈕，value表示按鈕上的文字
radio：單選框，value表示該單選框的真實(shí)值（一般真實(shí)值和數(shù)據(jù)庫對(duì)應(yīng)，顯示的值給用戶參考的）
checkbox：復(fù)選框，value表示該復(fù)選框的真實(shí)值
hindden：隱藏表單域，value表示該表單域的值。
單選和多選：
input中的value可以理解為傳送給服務(wù)器的值
type可以是button普通按鈕，submit提交按鈕，reset重設(shè)按鈕，radio單選框，checkbox復(fù)選框，passward密碼輸入框
?是提交給服務(wù)器的，服務(wù)器語言會(huì)調(diào)用里面的值 你沒value的話，服務(wù)器就沒數(shù)據(jù)
?服務(wù)器通過 name 知道傳的是誰的值 value則是對(duì)應(yīng)的值是

5：<textarea name="5" rows="10" cols="48">這里是初始化文字-這里是初始化文字-這里是初始化文字-這里是初始化文字-這里是初始化文字-這里是初始化文字-這里是初始化文字-這里是初始化文字-這里是初始化文字</textarea>

rows設(shè)置瀏覽器文本區(qū)高度 cols設(shè)置寬度 開始和結(jié)束標(biāo)簽中間為初始化文字 在textarea元素中加個(gè)maxlength屬性可以限制輸入文字的的字符

6：請(qǐng)選擇<select name="6"><option value="傳遞給服務(wù)器的數(shù)據(jù)">選擇1</option><option value="傳遞給服務(wù)器的數(shù)據(jù)">選擇2</option><option value="傳遞給服務(wù)器的數(shù)據(jù)" selected>選擇3</option><option value="傳遞給服務(wù)器的數(shù)據(jù)">選擇4</option></select>

以上數(shù)據(jù)提交后瀏覽器會(huì)提交6=”傳送服務(wù)器的數(shù)據(jù)”，即name=”value“ 到服務(wù)器，與選擇的按鈕內(nèi)容無關(guān)

selected布爾屬性，布爾屬性不需要值，當(dāng)進(jìn)入頁面時(shí)這個(gè)選項(xiàng)會(huì)被默認(rèn)選中

?form標(biāo)簽中的表單元素可以是input也可以是textarea select option

7:<input type="number" min="0" max="20" value="請(qǐng)輸入數(shù)字"><br><br><br> 輸入數(shù)字和允許輸入數(shù)字的最大值最小值<br><br><br> 8:<input type="range" min="0" max="20" step="5"><br><br><br> range類似number 只是會(huì)顯示一個(gè)滑動(dòng)條而 其中step設(shè)置間隔數(shù)（步數(shù)）<br><br><br> 9：<input type="color"><br><br><br> 點(diǎn)擊彈出顏色選框<br><br><br> 10：<input type="date"><br><br><br> 點(diǎn)擊后彈出一個(gè)時(shí)間選擇框 火狐不支持此屬性會(huì) 顯示text文本框 11：<input type="email"><input type="tel"><input type="url"> 手機(jī)端會(huì)得到一個(gè)定制的鍵盤

?

<input type="checkbox" name="extras[]" value="catalog" checked>

編寫name.php服務(wù)器腳本所用的腳本腳本語言（php）希望得到一點(diǎn)提示，想知道一個(gè)表單變量包含多少個(gè)值，提供這個(gè)提示的做法就是在名字后面增加一個(gè)”[]“

?

<input type="passworld" name="secret">

輸入的文本會(huì)加掩碼

<input type="file" name="doc">

可以選擇上傳一個(gè)文件 文件內(nèi)容會(huì)上傳到服務(wù)器，必須使用post方法

<input type="text" placeholder="Buckaroo Banzai">

大多數(shù)input標(biāo)簽都可以使用placeholder屬性，他會(huì)提示你要在文本框中輸入的內(nèi)容

<input type="text" placeholder="1" required>

required是一個(gè)布爾屬性， 也就是這個(gè)文本框必須輸入內(nèi)容后才可以提交

二、

轉(zhuǎn)載于:https://www.cnblogs.com/cheney-cai/p/5955234.html

超強(qiáng)干貨來襲 云風(fēng)專訪：近40年碼齡，通宵達(dá)旦的技術(shù)人生

總結(jié)

以上是生活随笔為你收集整理的Form表单中的元素 控件集的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。