HTML笔记 ( 五 ) form 标签

---

博主的 Github 地址

---

 
 

1. form 标签

• 作用:
  用于为用户输入创建 HTML 表单, 可用于前后端发送信息
  表单能够包含 input 元素, 比如文本字段, 复选框, 单选框, 提交按钮等等.
  表单还可以包含 menus, textarea, fieldset, legend 和 label 元素.

form 的几个属性
action属性

• 作用:
  定义发送目标的地址

method属性

• 作用:
  定义发送数据的方式, 有 get 和 post 两种方式

2. input标签

• 作用:
  用于搜集用户信息.
  根据不同的 type 属性值, 输入字段拥有很多种形式.
  输入字段可以是文本字段, 复选框, 掩码后的文本控件, 单选按钮, 按钮等等.

 
 
input 标签的 type 属性

button 类型

• 作用:
  用于定义可点击按钮 ( 多数情况下, 用于通过 JavaScript 启动脚本 )

radio 类型

• 作用:
  用于定义单选按钮

• 注意:
  使用时必须设置 input 的另外两个属性, name 和 value, 用以区分按钮组和输入值
  通过相同的 name 来将 radio button 设置于同一选择器当中

checkbox 类型

• 作用:
  用于定义复选框

• 注意:
  它和 radio 用法类似, 但它是复选框
  同时, 它可以通过 input 的 checked 属性来设定默认选中

text 类型

• 作用:
  用于定义单行的输入字段, 用户可在其中输入文本. 默认宽度为 20 个字符.

password 类型

• 作用:
  用于定义密码字段. 该字段中的字符会被掩码, 变成 ***** ( 或其他形式的码 )

file 类型

• 作用:
  用于定义输入字段和 “浏览” 按钮, 供文件上传

hidden 类型

• 作用:
  用于 定义隐藏的输入字段

image 类型

• 作用:
  用于定义图像形式的提交按钮

reset 类型

• 作用:
  用于定义重置按钮. 重置按钮会清除表单中的所有数据

submit 类型

• 作用:
  用于定义提交按钮. 提交按钮会把表单数据发送到服务器

 
 

3. select 标签

• 作用:
  用于定义下拉框

• 选项内容
  用 <option> 进行定义

select 标签的 name 属性

• 作用:
  用于给下拉框设置名字

option 标签的 value 属性

• 作用:
  用于给选项设置传送到后端的值, 这个值才是传送到后端的数据, option 中的 text 值只是用来给用户看的