美文网首页
HTML 表单的用法

HTML 表单的用法

作者: vs陈默 | 来源:发表于2017-08-08 01:20 被阅读0次

form

form 会自动处理 submit 事件 (submit 事件通常由 type=submit 的 input 或者 button 的元素触发)

form 会自动做一层校验,使用 form.novalidate 可以关闭原生的 validate

form 会根据每一个表单元素的 name 取得对应的用户输入, 然后将 form data 以 query string 的形式添加到 action 属性对应
的 url 后面。默认的请求方法是 GET, 默认的action 是当前的 url。

input:

常用的 type 有 checkbox, tel, number, email 等

textarea

select

option

反馈型 elements

只是单纯地反馈信息, 不需要跟用户进行交互的表单元素,我们把它们归类为 反馈型表单元素

以下转自 :http://www.jianshu.com/p/bb2f0cbc44e4

  <form>元素的属性

  1.name:表单的名称
  2.action: 表单提交的地址
  3.method:提交保单的方法有get和post,与http协议的这两种方式相对应。异同如下:

get将表单中数据的按照variable=value的形式,添加到action所指向的URL后面,并且两者使用“?”连接,而各个变量之间使
用“&”连接;post是将表单中的数据放在form的数据体中,按照变量和值相对应的方式,传递到action所指向URL。
get是不安全的,因为在传输过程,数据被放在请求的URL中,而如今现有的很多服务器、代理服务器或者用户代理都会将
请求URL记录到日志文件中,然后放在某个地方,这样就可能会有一些隐私的信息被第三方看到。另外,用户也可以在浏览
器 上直接看到提交的数据,一些系统内部消息将会一同显示在用户面前。post的所有操作对用户来说都是不可见的。
get传输的数据量小,这主要是因为受URL长度限制;而Post可以传输大量的数据,所以在上传文件只能使用post。
get限制Form表单的数据集的值必须为ASCII字符;而post支持整个ISO10646字符集。
get是用来从服务器上获得数据,而post是用来向服务器上传递数据。

  . target:定义在何处打开action(默认:_self)
    .enctype:被提交数据的编码(默认:url-encoded)

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


   <form>包含的表单元素

   1.  <input>

      <input> 元素有很多形态,由type 属性定义。必须包含name属性,用于记录提交数据的名称。

    .type属性类型描述:

    >text 常规文本输入。可用value属性定义默认值。可用 placeholder属性提升用户输入,submit提交表单时,此提示不会
    被提交

    >password 密码输入,字符输入后自动隐藏。可用 placeholder属性提升用户输入,submit提交表单时,此提示不会被提
     交

     >checkbox 复选框输入(多个选项中可选择多个选项)。同一组数据,对应的name属性相同,每个选项的值由value属
    性定义
   
    >radio 单选按钮输入(多个选项中选择一个选项)。同一组数据,对应的name属性相同,每个选项的值由value属性定义

    >file 选择文件。可原则的文件类型由accept属性定义

    >reset 重置用户输入
 
    >button 显示按钮,不能用于提交表单
 
     >submit 提交按钮(提交表单)

2.<select>

<select>元素定义下拉列表。必须包含name属性,用于记录提交数据的名称
下拉列表元素由<option>标签定义。列表通常会把首个选项显示为被选选项。可通过添加 selected 属性来定义预定义选项。
列表值由value属性定义。

3.<textarea>

<textarea>元素定义多行输入字段(文本域)。必须包含name属性,用于记录提交数据的名称。行内元素。

4.<label>

<label>元素用来提示<input>、<select>、<textarea>等输入元素表头,可用for属性与属入元素id相关联,帮助输入元素聚焦鼠标输入。行内元素。

相关文章

  • HTML表单的简单用法

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

  • HTML表单的用法

    HTML表单的用法 表单表单作用:HTML表单用于搜集不同类型的用户输入。表单的工作机制访问一个含有表单的页面输入...

  • FORM 表单

    html表单的简单用法 form表单作用: form标签用于为用户输入创建HTML表单,用于向服务器传输数据 fo...

  • 表单的一些用法

    HTML表单的一些用法 1.表单的作用: HTML 表单用于接收不同类型的用户输入,用户提交表单时向服务器传输数据...

  • HTML表单的用法

    Html表单用于搜集不同类型的用户输入。 常用属性

    元素 元素定义 HTML 表单区间,而这个区间的...

  • html表单的用法

    form 是html中一个比较常用的标签,form的作用是用来收集用户输入的信息,即用户需要与服务器交互,需要提交...

  • HTML 表单的用法

    什么是form表单 表单在网页中主要负责数据采集功能,把用户填写的信息提交到网站的后台服务器。 form标签的常用...

  • HTML 表单的用法

    HTML 表单用于搜集不同类型的用户输入。用户提交表单时向服务器传输数据,从而实现用户与Web服务器的交互。HTM...

  • HTML 表单的用法

    一、基础概念知识 1.表单主要分为两部分: 一是HTML文档描述的表彰;二是提交后的表单处理(服务器端处理数据,这...

  • HTML 表单的用法

    一、表单的作用 表单在网页中主要负责数据采集功能。一个表单有三个基本组成部分:表单标签:这里面包含了处理表单数据所...

网友评论

      本文标题: HTML 表单的用法

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