email

此类型要求输入格式正确的email地址,否则浏览器是不允许提交的,并会有一个错误信息提示.此类型在Opera中必须指定name值,否则无效果.

url

要求输入格式正确的URL地址,Opera中会自动在开始处添加http://.

number

要求输入格式数字,默认会有上下两个按钮,opera支持更好

tel

此类型要求输入一个电话号码,但实际上它并没有特殊的验证,与text类型没什么区别.

range

此类型将显示一个可拖动的滑块条,并可通过设定max/min/step值限定拖动范围.拖动时会反馈给value一个值.

color

此类型表单,可让用户通过颜色选择器选择一个颜色值,并反馈到value中,可以设置默认值

date, time, datetime, datetime-local, month, week

这一系列是很酷的一个类型,完全解决了烦琐的JS日历控件问题.但目前MS只有Opera/Chrome新版本支持,且展示效果也不一样.

time

datetime

datetime-local

month

week

search

此类型表示输入的将是一个搜索关键字,通过results=s 或者 x-webkit-speech 可显示一个搜索小图标. [在chrome下才能看得见]

required

表单验证属性为require类型时,若输入值为空,则拒绝提交,并会有一个提示.这个很有用.并且可以用于textarea以及hidden/image/submit类型.

pattern

pattern类型为正则验证,可以完成各种复杂的验证.这两种类型在Opera中必须指定name值,否则无效果.

placeholder

这是一个很实用的属性,免去了用JS去实现点击清除表单初始值.浏览器支持也还不错,标准浏览器都能很好的支持.

autofocus

默认聚焦属性,可在页面加载时聚焦到一个表单控件,类似于JS的focus().

list

该属性需要与datalist属性共用,datalist是对选择框的记忆,而list属性可以为选择框自定义记忆的内容.

aaaaa

bbbbb

ccccc

autocomplete

此属性是为表单提供自动完成功能.如果该属性为打开状态可很好地自动完成.一般来说,此属性必须启动浏览器的自动完成功能.

keygen

keygen 标签规定用于表单的密钥对生成器字段。当提交表单时,私钥存储在本地,公钥发送到服务器。所有主流浏览器都支持 keygen 标签,除了 Internet Explorer 和 Safari。

datalist

datalist 标签定义选项列表。与 input 元素配合使用该元素,来定义 input 可能的值。datalist 及其选项不会被显示出来,它仅仅是合法的输入值列表。

用 input 元素的 list 属性来绑定 datalist。

搜索引擎

progress

progress 标签定义运行中的进度(进程)。可以使用 progress 标签来显示 JavaScript 中耗费时间的函数的进度。

contenteditable

此属性可以让摸个元素里面的文本节点或值变为可编辑

可以编辑的内容

可以编辑的内容

form表单演示

搜索

请输入搜索内容

加密强度

用户名

Email

密码

年龄

身高

生日

颜色

搜索引擎

html5表单新增验证属性,HTML5表单增强属性相关推荐

  1. php表单服务器验证失败,php 表单验证代码(验证失败显示提示信息)

    搜索热词 感兴趣的小伙伴,下面一起跟随编程之家 jb51.cc的小编来看看吧. 经测试代码如下: /** * 表单验证 * * @param * @arrange (512.笔记) jb51.cc * ...

  2. 【微信小程序】表单提交验证及获取表单输入的值

    效果图: 说明:请选择房屋所在城市的效果是省市区选择器,刚开始我们可能直接在picker选择器中直接包含一个input输入框实现,但是这样的话点击选择的话可能聚焦在输入框中,我们想要的效果是点击的时候 ...

  3. dreamweaver 正则表达式为属性值加上双引号_IT兄弟连 HTML5教程 HTML5表单 新增的表单属性3...

    9 novalidate novalidate是属性规定在提交表单时不应该验证form和input域.novalidate属性适用于的类型有:text.search.url.telephone.ema ...

  4. html5密码确认属性,HTML5表单及其验证【html自带属性验证】

    HTML表单一直都是Web的核心技术之一,有了它我们才能在Web上进行各种各样的应用.HTML5 Forms新增了许多新控件及其API,方便我们做更复杂的应用,而不用借助其它Javascript框架, ...

  5. html5表单新增的输入类型,HTML5之表单新增类型介绍

    1.html5的input标签的type类型新增介绍: 2.表单新增属性介绍: 3.代码示例: 1970 1980 1990 默认值: form="register" /> ...

  6. 增加表单的文字段的html的代码是,表单及表单新增元素(示例代码)

    要想更好运用表单就要了解表单的的更多元素与属性,首先看看对表单基本了解. 表单的基本了解 元素用于用户输入数据的收集 元素是最重要的表单元素,有许多type其中是用于向表单处理程序提交表单的按钮. 元 ...

  7. HTML 表单和验证

    HTML5表单验证 本笔记参考b站视频总结,如有侵权请联系我.视频地址:https://www.bilibili.com/video/BV16K4y1Z7Gb?p=1&vd_source=df ...

  8. php 自动验证表单类,thinkPHP 表单自动验证功能

    昨天晚上我们老大叫我弄表单自动验证功能,愁了半天借鉴了好多官网的知识,才出来,诶,总之分享一下我自己的成果吧! thinkphp 在Model基类为我们定义了自动验证的函数和正则表达式,我们只需要在对 ...

  9. html 表单js验证,JavaScript使用表单元素验证表单

    第一章:使用JavaScript验证表单 JavaScript的主要作用:验证表单 1最简单的表单验证-禁止空白的必填项目 1.1最简单的HTML结构 网站最基础的就是注册,它是一个系统的交互基础. ...

最新文章

  1. c语言中gets函数可以输入空格吗_C语言中printf和gets函数的实用技巧
  2. C# 类中继承接口的属性
  3. vue 中watch函数名_vue中避免使用函数来绑定依赖
  4. [eslint-plugin-vue] [vue/no-unused-vars] 'scope' is defined but never used.
  5. 如何获取当前刀具号_数控刀具的选用原则,如何使用数控刀具?一文全面介绍数控刀具...
  6. 让Netty“榨干”你的CPU
  7. Java—static关键字
  8. 【es】es Plugin 组件加载 PluginsService
  9. ld cannot find an existing library
  10. [导入]在SYBASE数据库中使用游标(Cursors)将多行查询结果进行逐行处理
  11. 计算机控制技术在医学的应用,华北工控:嵌入式计算机在医疗CT机中的应用
  12. mysql之我们终将踩过的坑(优化)
  13. LAME 使用/参数说明, 很好的程序
  14. 当乐app官方下载android,当乐下载安卓最新版_手机官方版免费安装下载_豌豆荚
  15. Unity调用Window提示框Yes/No(英文提示窗)
  16. Qt Quick实现的涂鸦程序
  17. SQLite简介,C#调用SQLite
  18. 大学最重要的 8 件事
  19. 取模运算(包括负数)
  20. aliyun-oss-02

热门文章

  1. Latex调节目录间距\tableofcontents
  2. OpenCV-向上采样cv::pyrUp向下采样cv::pyrDown
  3. 解决方案-Visual Studio生成库(DLLLIB)以及如何调用
  4. cesium 文本标注被遮挡_Cesium-知识点(Viewer)
  5. mysql+服务+监控_mysql从服务器监控
  6. php 判断是否是机器人,如何用PHP检测搜索引擎机器人?
  7. 亲密关系-【沟通目标】如何建立有效的谈话目标
  8. 21天jenkins打卡Day4-新增账号
  9. linux tcp文件分包_在Linux下基于TCP协议的文件传输程序.
  10. 张家口zec挖矿软件哪里下载_电脑小白去哪里下载正规软件?