1.Form标签用来将表单外的内容与表单进行关联。其主要元素有input,button,select。

action属性:指定表单的发送地址。

Novalidate属性:数据提交时不校验。

Target属性:指定在何处打开指定的url。

method属性:表单数据发送至服务器的方法,默认属性就是get。常用的有:get和post。

      Get:数据会附在网址之后主动提交给服务器。

      Post:数据不会附在网址后,会将数据打包发送给服务器,等候服务器来读取数据。

2.Input标签

Type属性指定输入内容的类型,默认是text单行文本框。其他类型:

  ①Text,Password,checkbox(checked设置默认值),radio(checked设置默认值,且必须将同一组单选项设置一个相同的name)。

  ②submit,reset,button。

  ③image(图片式提交按钮),hidden(隐藏字段)。

  ④email(邮箱- -会校验),tel(电话- - 不会校验),url(一个网址- -会校验)。

  ⑤number(配合max/min/step/value规定最大值/最小值/步长/默认值);

   range(同number。也是表示一定范围的数值输入,但是是以活动条的状态显示)。

  ⑥color(建立一个颜色的选择输入框);

   时间类(datetime-local,date,month,week,time)。

  ⑦Search(建立一个搜索框,供用户输入搜索的关键词);

   File(创建一个文件选取的输入框,可通过accept属性规定选取文件的类型。Multipe可以设定一次允许选择多个文件。)

Name属性:输入内容的识别名称,传递参数时的参数名称。

Value属性:默认值。

Size属性:可以使文本框变长。

Maxlength属性:输入的最大字数。

Readonly属性:只读属性,设置的内容不可变更。

Disabled属性:设置为不可用(不可操作)。

Required属性:设置该内容为必须填写项,否则无法提交。

Placeholder属性:当文本框活得焦点时被清空。

Autocomplet属性:属性值为on/off,定义是否开启浏览器自动记忆功能。

autofocus属性:自动获得焦点。

Accesskey属性:指定快捷键(指定快捷键后,按alt+快捷键便可以自动或得焦点。)

Tabindex属性:指定按tab键时,项目间的移动顺序。

3.button标签与input标签建立的按钮相同(在form中尽量用input,其他地方可以用button

Type属性:值有submit、reset、button

Name/value/disable属性:同input

Autofocus属性:按钮自动获得焦点

Form属性:设定按钮属于哪个表单

Formmethod属性:谁当表单提交方式,将覆盖之前的提交方式

Formnovalidate属性:

Formaction属性:指定表单发送的对象url

Formenctype属性:指定表单数据发送类型

Formtarget属性:

4.Select标签和datalist标签

5.Label标签作用是点标签上的字也能选中复选框。

6.optgroup标签作用是分组。

7.textarea标签多行文本框。

8. output标签for元素定义输出域相关的元素。

oninput表单事件:当用户对元素数据输入的时候触发。

parseInt()函数:解析字符串,返回一个整数。

9. progress标签:进度条。属性有:max,value进度条当前值,form。

 meter标签:度量条。属性有:max,min,value,form,low低标准,high高标准(高低标准区域与中间区域颜色不一样)。

10. fieldset标签:将表单内相关元素分组,通常会有一个边框。

   legend标签:为fieldset定义一个标题。

11. keygen标签:建立一个密钥生成器,当提交表单时,私钥存储在本地,公钥发送到服务器,主要作用是提供一种用户验证身份的方法。

①属性有:name,form,autofocus,disabled.

②challenge属性:将keygen的值设置在提交时间。

③keytype属性:定义密钥类型,如RSA密钥。

12. pattern属性设定输入类型的正则表达式。

13.details标签:用于描述文档的细节。open属性规定页面上的details是可见的。

  summary标签:为details定义标题,用户点击标题时,会显示出details中的内容。

3.form表单的更多相关文章

  1. form表单验证-Javascript

    Form表单验证: js基础考试内容,form表单验证,正则表达式,blur事件,自动获取数组,以及css布局样式,动态清除等.完整代码如下: <!DOCTYPE html PUBLIC &qu ...

  2. Form 表单提交参数

    今天因为要额外提交参数数组性的参数给form传到后台而苦恼了半天,结果发现,只需要在form表单对应的字段html空间中定义name = 后台参数名 的属性就ok了. 后台本来是只有模型参数的,但是后 ...

  3. form表单 ----在路上(15)

    form 表单就是将用户的信息提交到服务器,服务器会将信息存储活着根据信息查询数据进行增删改查,再将其返回给用户. 基本格式: <form action="" method ...

  4. form表单的字符串进行utf-8编码

    <form>表单有assept-charset属性.该属性规定字符的编码方式,默认是"unknown",与文档的字符集相同. 该属性除了Internet explore ...

  5. 细说 Form (表单)

    细说 Form (表单) Form(表单)对于每个WEB开发人员来说,应该是再熟悉不过的东西了,可它却是页面与WEB服务器交互过程中最重要的信息来源. 虽然Asp.net WebForms框架为了帮助 ...

  6. 通过form表单的形式下载文件。

    在项目中遇到问题,要求动态拼接uri下载文件.但是由于项目的安全拦截导致window.location.href 和 window.open等新建窗口的方法都不行. 无意间百度到了通过form表单来下 ...

  7. form 表单跨域提交

    <!DOCTYPE html><html> <head> <title>form 表单上传文件</title> <script src ...

  8. form表单的属性标签

    form表单的常用标签 表单: <form id="" name="" method="post/get" action=" ...

  9. form表单的属性标签和练习

    form表单的标签 做一个如下图的form表单: 我们的代码如下: <body leftmargin="400px" topmargin="200px"& ...

  10. Django基础,Day5 - form表单投票详解

    投票URL polls/urls.py: # ex: /polls/5/vote/ url(r'^(?P<question_id>[0-9]+)/vote/$', views.vote, ...

随机推荐

  1. eslint语法规范

    规则 缩进使用两个空格. eslint: indent   function hello (name) {   console.log('hi', name)   } 1 2 3 字符串使用单引号,除 ...

  2. [Python] Django框架入门

    说明:Django框架入门 当前项目环境:python3.5.django-1.11 项目名:test1 应用名:booktest 命令可简写为:python manager.py xxx => ...

  3. Android读取date中年月日

    1.Date对象:Date date = getDate(); 2.Calendar实例:Calendar calendar = Calendar.getInstance(); 3.calendar. ...

  4. safari打不开该网页,因为网址无效

    Safari打开导航时,提示:safari打不开该网页 因为网址无效 解决方法:安装百度地图

  5. CF 435B Little Pony and Harmony Chest

    Little Pony and Harmony Chest 题解: 因为 1 <= ai <= 30 所以  1 <= bi <= 58, 因为 59 和 1 等效, 所以不需 ...

  6. POJ2084 Game of Connections 卡特兰数 关于卡特兰数经典的几个问题

    Game of Connections Time Limit: 1000MS   Memory Limit: 30000K Total Submissions: 9128   Accepted: 44 ...

  7. poj 1417 True Liars(并查集+背包dp)

    题目链接:http://poj.org/problem?id=1417 题意:就是给出n个问题有p1个好人,p2个坏人,问x,y是否是同类人,坏人只会说谎话,好人只会说实话. 最后问能否得出全部的好人 ...

  8. Python---网络爬虫初识

    1. 网络爬虫介绍 来自wiki的介绍: 网络爬虫(英语:web crawler),也叫网上蜘蛛(spider),是一种用来自动浏览万维网的网络机器人. 但是我们在写网络爬虫时还要注意遵守网络规则,这 ...

  9. java中自定义注解的应用

    要想深刻的理解注解,我们必须能实现自己的注解,然后应用自己的注解去实现特定的业务,使用注解可以更优雅的做到某些事情. 有这样一个场景,在需要文件导出时,我们需要将一个model中的一些重要字段导出到c ...

  10. web scraper 抓取数据并做简单数据分析

    其实 web scraper 说到底就是那点儿东西,所有的网站都是大同小异,但是都还不同.这也是好多同学总是遇到问题的原因.因为没有统一的模板可用,需要理解了 web scraper 的原理并且对目标 ...