html 表單

　　表單的標簽是<form>，用于給網站的后臺提交數據。提交的數據格式原本是什么樣不太清楚，以python的flask框架來看，我從表單中得到的數據是一個字典（flask.request.form），可以從中獲取到表單中提交上來的數據。字典的鍵是各個表單元素的name屬性的值，值則是用戶的輸入。

?

■　　<form>

　　form本身具有一些屬性，比如action指定了一個url，就是當把表單中的數據提交上去后由url指定的程序來處理這些數據。這個指定的程序可以是一個.php腳本之類的文件，也可以是比如flask框架中的一個路徑處理函數。其他屬性還有：

　　action　　指定了一個程序來處理

　　method　　指定這個表單的提交方法，可選post,get等

　　target　　指定action中的url的目標

　　name　　指定一個表單的名稱

　　等等

?

■　　<input>

　　基本的表單組件很多都是input標簽，不同的是其type屬性的值。type屬性的值決定了這個表單元素到底是個什么東西。比如：

　　<input type="text" value="default_text" name="test_text" maxlength="設置輸入最長長度" size="設置本身輸入框長度" />　　一個明文輸入框，默認值是default_text

　　<input type="password" name="test_passwd" maxlength="..." size="..." />　　一個密碼輸入框

　　<input type="submit" value="按鈕上顯示的文字" name="test_submit" />　　一個提交按鈕，按下提交按鈕后提交整個表單的數據到服務器，和submit類似的，若type是個reset則是個清空按鈕

　　<input type="radio" name="group1" value="radio_info" checked>some label text</input>　　一個單選項，對于多個單選項，所有name一樣的屬于同一個組，一個組的所有選項只能有一個被選中，value是提交數據時該單選項的值，checked標識了該選項被選中，如果同一組內多個radio都有checked的話以最后設置的那個為準。某個radio沒有選的話就不會傳這個元素的鍵值對到后端去。

　　<input type="checkbox" name="group2" value="check_info" checked>some label text</input>　　一個復選框，屬性和radio類似，但是不存在一個組只能選一個，value屬性寫的一些信息，作為這個復選框元素的值隨其他數據一起提交到后端。沒有選的話同樣不傳數據

　　<input type="number" name="quantity" min="1" max="5">　　一個數字輸入框，可以設置最小值和最大值

　　<input type="file" id="file_id" name="file_name">　　構造一個文件上傳的部件（具體怎么上傳，如何和后端互動還不清楚）

　　以上是經典html中的一些input類型，html5中支持更多類似于日期，顏色等的input。http://www.w3school.com.cn/html/html_form_input_types.asp

　　此外，input標簽還有很多單獨的屬性用來設置它的一些特性，比如上面的單選多選框中提到的checked屬性，除了checked還有：

　　　　readonly　　設置某個input只讀不可編輯

　　　　disabled　　設置某個input不可用不可編輯

　　　　size，maxlength這些屬性上面提到過了，就不說了

?

■　　其他表單元素

　　上面提到了input，input已經有很多表單元素的形式了，除了那些input，我們還有以下一些元素

　　<select>　　下拉列表，里面要添加<option>,option可以設置selected，value等屬性，提示用文字寫在option里面

　　<select multiple>　　多選框列表

<select name="cars"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fiat">Fiat</option> <option value="audi">Audi</option> </select>

?

　　<textarea>　　多行文本框，可以設置屬性諸如name,rows,cols等（rows和cols指定初始狀態的行列數），也可以設置disabled,readonly,maxlength等

　　<button>　　獨立按鈕，可以設置onclick等屬性が，反正要用jQuery的話就無所謂onclick了

?

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的【HTML】 HTML基础知识 表单的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。