HTML 開發(fā)手冊
/ <form>
<form>
HTML <form> 標(biāo)簽 實(shí)例 帶有兩個輸入字段和一個提交按鈕的 HTML 表單： <form action='demo_form.php' method='get'> First name: <input type='text' name..>.........
HTML <form> 標(biāo)簽
實(shí)例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <form action="demo-form.php"> First name: <input type="text" name="FirstName" value="Mickey"><br> Last name: <input type="text" name="LastName" value="Mouse"><br> <input type="submit" value="提交"> </form> <p>點(diǎn)擊"提交"按鈕，表單數(shù)據(jù)將被發(fā)送到服務(wù)器上的“demo-form.php”。</p> </body> </html>
運(yùn)行實(shí)例 ?
點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例
瀏覽器支持
所有主流瀏覽器都支持 <form> 標(biāo)簽。
標(biāo)簽定義及使用說明
<form> 標(biāo)簽用于創(chuàng)建供用戶輸入的 HTML 表單。
<form> 元素包含一個或多個如下的表單元素：
<input>
<textarea>
<button>
<select>
<option>
<optgroup>
<fieldset>
<label>
HTML 4.01 與 HTML5之間的差異
HTML5 新增了兩個新的屬性：autocomplete 和 novalidate，同時不再支持 HTML 4.01 中的某些屬性。
HTML 與 XHTML 之間的差異
在 XHTML 中，name 屬性已被廢棄。使用全局 id 屬性代替。
屬性
New ：HTML5 中的新屬性。
| 屬性 | 值 | 描述 |
|---|---|---|
| accept | MIME_type | HTML5 不支持。規(guī)定服務(wù)器接收到的文件的類型。（文件是通過文件上傳提交的） |
| accept-charset | character_set | 規(guī)定服務(wù)器可處理的表單數(shù)據(jù)字符集。 |
| action | URL | 規(guī)定當(dāng)提交表單時向何處發(fā)送表單數(shù)據(jù)。 |
| autocompleteNew | on off | 規(guī)定是否啟用表單的自動完成功能。 |
| enctype | application/x-www-form-urlencoded multipart/form-data text/plain | 規(guī)定在向服務(wù)器發(fā)送表單數(shù)據(jù)之前如何對其進(jìn)行編碼。（適用于 method="post" 的情況） |
| method | get post | 規(guī)定用于發(fā)送表單數(shù)據(jù)的 HTTP 方法。 |
| name | text | 規(guī)定表單的名稱。 |
| novalidateNew | novalidate | 如果使用該屬性，則提交表單時不進(jìn)行驗(yàn)證。 |
| target | _blank _self _parent _top | 規(guī)定在何處打開 action URL。 |
全局屬性
<form> 標(biāo)簽支持 HTML 的全局屬性。
事件屬性
<form> 標(biāo)簽支持 HTML 的事件屬性。
嘗試一下 - 實(shí)例
帶有復(fù)選框的表單
此表單包含兩個復(fù)選框和一個提交按鈕。
實(shí)例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <form action="demo-form.php" method="get"> <input type="checkbox" name="vehicle" value="Bike"> I have a bike<br> <input type="checkbox" name="vehicle" value="Car" checked="checked"> I have a car<br> <input type="submit" value="提交"> </form> </body> </html>
運(yùn)行實(shí)例 ?
點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例
帶有單選按鈕的表單
此表單包含兩個單選框和一個提交按鈕。
實(shí)例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <form action="demo-form.php" method="get"> <input type="radio" name="sex" value="Male"> Male<br> <input type="radio" name="sex" value="Female" checked="checked"> Female<br> <input type="submit" value="提交"> </form> </body> </html>
運(yùn)行實(shí)例 ?
點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例
相關(guān)文章
HTML 教程：HTML 表單和輸入
HTML DOM 參考手冊： Form 對象