HTML 表单

HTML 表单

表单是一个包含表单元素的区域。

表单元素是允许用户在表单中输入内容,比如：文本域(textarea)、下拉列表、单选框(radio-buttons)、复选框(checkboxes)等等。

表单使用表单标签 <form> 来设置的，下面就来好好介绍一下HTML 表单元素。

<form> 元素

定义 HTML 表单

<form> . input 元素 . </form>

表单元素指的是不同类型的 input 元素、复选框、单选按钮、提交按钮等等

input元素

用于输入框，其输入类型是由类型属性（type）定义的

类型	描述
text	定义常规文本输入
radio	定义单选按钮输入（选择多个选择之一）
submit	定义提交按钮（提交表单）
password	定义密码字段的输入
checkbox	定义多选按钮输入

文本输入与密码字段输入

实例

<form> 用户名：<input type="text"> 密码：<input type="password"> </form>

运行实例 »

点击 "运行实例" 按钮查看在线实例

运行结果：

单选与多选

实例

<form> 单选：<input type="radio" name="sex" value="male">男 <input type="radio" name="sex" value="female">女<br> 多选：<input type="checkbox" name="subject" value="Math">数学      <input type="checkbox"  name="subject" value="English">英语 </form>

运行实例 »

点击 "运行实例" 按钮查看在线实例

运行结果：

提交

当涌入输入完成后点击提交，表单的内容会被传送到另一个文件

实例

<form> <input type="text"> <input type="submit" name="submit"> </form>

运行实例 »

点击 "运行实例" 按钮查看在线实例

运行结果

HTML Form 属性

属性	描述
action	指向何处提交表单的地址（URL）
enctype	指被提交数据的编码（默认：url-encoded）
method	指在提交表单时所用的 HTTP 方法（默认：GET）
name	指识别表单的名称
target	指 action 属性中地址的目标
novalidate	指浏览器不验证表单
accept-charset	指在被提交表单中使用的字符集
autocomplete	指浏览器应该自动完成表单

表单中的GET与POST的使用

当表单提交的数据是是被动的，并且没有敏感信息可采用GET的方式提交

如果表单正在更新数据，或者是包含敏感信息时就可以用POST方式，因为它安全性更高