<表格>


HTML <form> 標籤

#實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(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>点击"提交"按钮，表单数据将被发送到服务器上的“demo-form.php”。</p>

</body>
</html>

執行實例»

點擊"運行實例" 按鈕查看線上實例

瀏覽器支援

1000.png

所有主流瀏覽器都支援 <form> 標籤。

標籤定義及使用說明

<form> 標籤用於建立供使用者輸入的 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 中的新屬性。

##MIME_typeHTML5 不支援。 規定伺服器接收到的檔案的類型。 （檔案是透過檔案上傳提交的）#character_set##規定伺服器可處理的表單數據字符集。 action#規定提交表單時要傳送表單資料到何處。 off規定是否啟用表單的自動完成功能。 enctype text/plain規定在向伺服器發送表單資料之前如何對其進行編碼。 （適用於 method="post" 的情況）method      post規定規定用於傳送表單資料的 HTTP 方法。 name#規定表單的名稱。 novalidate如果使用該屬性，則提交表單時不進行驗證。 target#      _top規定在何處開啟 action URL。
屬性值描述
accept
accept-charset
URL
autocompleteNew
on

application/x-www-form-urlencoded
multipart/form-data

get
text
novalidateNew

_blank
     _self
#      _parent
###

全域屬性

<form> 標籤支援 HTML 的全域屬性。

事件屬性

<form> 標籤支援 HTML 的事件屬性。

Examples

嘗試- 實例

帶有複選框的表單
此表單包含兩個複選框和一個提交按鈕。

實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(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>

運行實例»

點擊"運行實例" 按鈕查看線上實例

帶有單選按鈕的表單
此表單包含兩個單選框和一個提交按鈕。

實例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(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>

運行實例»

點擊"運行實例" 按鈕查看線上實例

相關文章

HTML 教學：HTML 表單與輸入

HTML DOM 參考手冊： Form 物件