HTML <form> 标签
在html中,表单是经常用到的,用来与用户交互并提交数据。而表单的<form>标签是使用来创建供用户输入的html表单,在网页中很常见,比如:注册和登录页面就是用表单实现的。
实例
<!DOCTYPE html><html><body><h1>form 元素用法</h1><form action="/example/html/html_page.aspx"><label for="fname">姓氏:</label><input type="text" id="fname" name="fname"><br><br><label for="lname">名字:</label><input type="text" id="lname" name="lname"><br><br><input type="submit" value="提交"></form><p>如果您点击提交,表单数据会被发送到名为 html_page.aspx 的页面。</p></body></html>
浏览器支持
| 元素 | |||||
|---|---|---|---|---|---|
| <form> | Yes | Yes | Yes | Yes | Yes |
所有浏览器都支持 <form> 标签。
定义和用法
<form> 标签用于为用户输入创建 HTML 表单。
表单能够包含 多种其他标签如:
- <input>
- <textarea>
- <button>
- <select>
- <option>
- <optgroup>
- <fieldset>
- <label>
- <output>
表单用于向服务器传输数据。
提示和注释
注释:form 元素是块级元素,其前后会产生换行。
HTML 与 XHTML 之间的差异
无
属性
HTML5 中的新属性。
| 属性 | 值 | 描述 |
|---|---|---|
| accept | MIME_type | HTML 5 中不支持。 |
| accept-charset | charset_list | 规定服务器可处理的表单数据字符集。 |
| action | URL | 规定当提交表单时向何处发送表单数据。 |
| autocomplete |
| 规定是否启用表单的自动完成功能。 |
| enctype | 见说明 | 规定在发送表单数据之前如何对其进行编码。 |
| method |
| 规定用于发送 form-data 的 HTTP 方法。 |
| name | form_name | 规定表单的名称。 |
| novalidate | novalidate | 如果使用该属性,则提交表单时不进行验证。 |
| rel |
| 规定链接资源和当前文档之间的关系。 |
| target |
| 规定在何处打开 action URL。 |
说明
- enctype 属性可能的值:
- application/x-www-form-urlencoded
- multipart/form-data
- text/plain
全局属性
<form> 标签支持 HTML 中的 全局属性。
事件属性
<form> 标签支持 HTML 中的 事件属性。
更多实例
<!DOCTYPE html><html><body><h1>Form 和 checkboxes 的用法</h1><form action="/example/html/html_page.aspx" method="get"><input type="checkbox" name="vehicle1" value="自行车"><label for="vehicle1"> 我有一辆自行车</label><br><input type="checkbox" name="vehicle2" value="汽车"><label for="vehicle2"> 我有一辆汽车</label><br><input type="checkbox" name="vehicle3" value="小船" checked><label for="vehicle3"> 我有一艘小船</label><br><br><input type="submit" value="提交"></form></body></html>
<!DOCTYPE html><html><body><h1>Form 和 radio buttons 的用法</h1><form action="/example/html/html_page.aspx" method="get"><input type="radio" id="male" name="gender" value="男士"><label for="male">Male</label><br><input type="radio" id="female" name="gender" value="女士" checked="checked"><label for="female">Female</label><br><input type="radio" id="other" name="gender" value="其他"><label for="other">Other</label><br><br><input type="submit" value="提交"></form></body></html>