HTML表单(5)

饥人谷学习第5天

HTML表单

• 表单是一个包含表单元素的区域
• 表单元素是允许用户在表单中（比如：文本域、下拉列表、单选框、复选框等等）输入信息

<form> 收集表单数据

action属性：表单数据提交到后台的地址
target属性：在何处打开action
enctype属性：编码方式

• application/x-www-form-urlencoded：在发送前编码所有字符(默认)
• text/plain：空格转换为"+"加号，但不对特殊字符编码
• multipart/form-data(比如：多媒体文件)：使用包含文件上传控件的表单时，必须使用该值

method属性：提交表单的方法

• get:
  把所有表单信息组装起来，加到URL后面（相当于URL的拼接）
• post
  URL不会发生变化，数据会通过浏览器传输给后台
• 区别：
  1.对URL的处理方式；
  2.安全性
  3.是否存在URL对数据大小的限制

浏览器向服务器发送数据的方式

详细的标签属性等

1.<input id="" type="" name="" value="">

• type="text"：普通的文本输入框，placeholder显示提示要输入的内容
• type="password"：输入内容为圆点，placeholder显示提示要输入的内容
• type="checkbox"：靠name属性分组，提交到后端的时候被选中的value是以，分割的一个字符串，通过那么属性获得
• type="radio"：靠name属性分组,单选
• type="file"：accept限制文件上传的格式
• type="hidden"：用于暂存一些信息，使用一些安全策略 name="" value=""
• type="button"
  此处还没有什么用处，点击无反应，反而只写<button>提交</button>却有用
• type="submit"
  提交按钮
• type="reset"
  清空用户的输入

2.<label for=""></label>

• 文字提示

当input为type="text"的id和label的for对应时，点击该label会使该input即可输入

3.<select name="">

• <option value="" selected>选项文本</option>
  多个option组成下拉菜单，selected表示下拉框默认选择显示。

4.<textarea name="">初始内容</textarea>

• 多行输入框