美文网首页
HTML 表单

HTML 表单

作者: web_Tracy | 来源:发表于2017-12-18 23:10 被阅读4次

HTML 表单指的是<form>标签包含的内容,MDN 定义如下:

HTML <form>元素表示了文档中的一个区域,这个区域包含有交互控制元件,用来向web服务器提交信息

form

属性:

  • action:提交表单的地址
  • method:提交表单的方式,分为 get 和 post
    post / get 的区别:
    post 比 get 安全,没有大小限制
  • enctype:编码方式,当 method 为 post 时,enctype 是提交 form 给服务器内容的 MIME 类型
    application/x-www-form-urlencoded:默认值
    multipart/form-data:用于 type 为 file 的 input 元素
    text/plain:H5

<form>中包含的元素:

1.label

标签,一般放置于其他表单元素前面

<label for="name">姓名</label>
<input id="name">

属性:
for的作用在于input的获焦,设置的值需于inputid一致

2.input

输入框的type类型有多种:

  • text:默认类型,文本输入
<input type="text">
  • checkbox:多选框,允许用户选择多个选项
<input type="checkbox" name="hobby" value="read">阅读
<!-- checked 默认选中 -->
<input type="checkbox" name="hobby" value="travel" checked>旅游
  • radio:单选框,互斥的选项需设置同一个name
<input type="radio" name="sex" value="male">男
<input type="radio" name="sex" value="female">女
  • submit:提交表单
<input type="submit" value="提交">
  • reset:清空表单
<input type="reset" value="重置">
  • hidden:不显示在页面上,但其值会被提交到服务器
<input type="hidden" name="country" value="China">
  • 还有 HTML5 新增的coloremailcolorrangetimenumber等等

3.textarea

文本域,多行输入,可拉伸缩小

<!-- cols 列数,rows 行数 -->
<textarea cols="30" rows="10"></textarea>

4.select

下拉菜单

<select name="city">
  <option value="shanghai">上海</option>
  <option value="wuhan">武汉</option>
  <!-- selected 默认选中 -->
  <option value="shenzhen" selected>深圳</option>
</select>

参考:
1.form 表单
2.input

相关文章

  • HTML表单的简单用法

    HTML表单的简单用法:HTML表单用于搜集不同类型的用户输入。 元素定义HTML表单。HTML表单包含表单元素。...

  • 简单介绍 HTML 表单的用法

    HTML 表单用于收集用户输入, 元素定义 HTML 表单。HTML 表单包含表单元素,表单元素指的是不同类型的...

  • HTML表单的用法

    html表单用于搜集不同类型的用户输入。

    元素 form元素定义html表单 HTML 表单包含表单元...

  • HTML学习笔记(四)

    一:HTML 表单 HTML 表单用于搜集不同类型的用户输入。 元素 HTML 表单用于收集用户输入。 HTML ...

  • HTML 表单的用法

    HTML 表单用于搜集不同类型的用户输入 元素定义 HTML 表单: 所有属性如下 HTML 表单包含表单元素表...

  • 08-表单

    本节案例 表单的作用 HTML 表单用于收集用户输入。 表单form 元素定义 HTML 表单,里面需要有各种表单...

  • Django学习-第十三讲(下):表单(一)forms.form

    1. html表单和django中的表单的区别 HTML中的表单: 单纯从前端的html来说,表单是用来提交数据给...

  • HTML4.01+CSS2.0教程(七)

    3/6/2017 12:33:03 PM html表单 html表单用于收集用户输入,而 元素用于定义html表单...

  • HTML表单介绍

    HTML 表单用于搜集不同类型的用户输入, 元素定义 HTML 表单;HTML 表单包含不同类型的 input ...

  • HTML表单用法

    HTML form表单用于为用户输入创建 HTML 表单。收集用户不同类型的数据。 HTML Form 語法 表单...

网友评论

      本文标题:HTML 表单

      本文链接:https://www.haomeiwen.com/subject/vpnewxtx.html