HTML5 十大新特性(二)——表单新特性
H5的表单新特性可以分为两大类。
一、10个input的type值
1、email:邮件输入域,在表单提交时提供简单的邮箱格式验证,并弹出一个提示窗口。
2、url:地址输入域,在表单提交时提供简单的URL地址格式验证,并弹出一个提示窗口。
3、number:数字输入域。(可设置min、max、step)
4、tel:电话号码输入域,在手机浏览器中弹出数字输入域。
5、search:搜索输入域,在手机浏览器右下角呈现搜索按键。
6、range:范围选择控件。
7、color:颜色选择控件。
8、date/month/week:时间选择控件。
二、11个表单元素新属性
1、autocomplete:自动补全,是否自动记录之前提交的数据,以用于下一次输入建议。
2、placeholder:占位符,用于在输入框中显示提示性文字,与value不同,不能被提交。
3、autofocus:自动获得输入焦点。
4、multiple:是否允许多个输入值,若声明该属性,那么输入框中允许输入多个用逗号隔开的值。
5、form:值为某个表单的id,若设置,则该输入域可放在该表单外面。
6、required:在表单提交时会验证是否有输入,没有则弹出提示消息。
7、maxlength:限制最大长度,只有在有输入的情况下才有用,不区分中英文。
7.5、minlength:限制最小长度,但它不是H5标准属性,仅部分浏览器支持。
8、min:限定输入数字的最小值。
9、max:限定输入数字的最大值。
10、step:限定输入数字的步长,与min连用。
11、pattern:指定一个正则表达式,对输入进行验证。(正则默认首尾加^$)
HTML5 十大新特性(二)——表单新特性的更多相关文章
- HTML5_01之表单新特性
1.WebStorm快捷键: Ctrl+Alt+(向下方向键):快速复制当前行 Alt+(向上/下方向键):移动当前行 Ctrl+D:删除当前行 Ctrl+/:快速(取消)注释当前行 Ctrl+Alt ...
- H5表单新特性
1.HTML5表单新特性之——新的input type <input type=" "> HTML5之前已有的input type: text.password.rad ...
- 完善:HTML5表单新特征简介与举例——张鑫旭
一.前言一撇 其实关于HTML5的表单特征早在去年“你必须知道的28个HTML5特征.窍门和技术”一文中就有所介绍(在第十一项),不过,有些遗憾的是,此部分的介绍是以视频形式展示的,其实,是视频还好啦 ...
- 从零开始学习前端开发 — 10、HTML5新标签及表单控件属性和属性值
一.html5新增标签 1.结构性标签 header 定义网页的头部 nav 定义网页的导航 footer 定义网页的底部 section 定义网页的某个区域 article 定义网页中的一篇文章 a ...
- HTML5表单新属性
HTML5表单新属性 autofocus 自动聚焦 <input type="text" autofocus> placeholder占位文本 tel ...
- HTML5新表单新功能解析
HTML5新增了很多属性功能.但是有兼容性问题,因为这些表单功能新增的.我这里做了一个简单的练习,方便参考.如果完全兼容的话,那我们写表单的时候就省了很多代码以及各种判断. <!DOCTYPE ...
- HTML5基础知识汇总_(2)自己定义属性及表单新特性
自己定义属性data-* 说起这个属性,事实上如今非经常见了;怎么说呢,由于在一些框架都能看到他的身影!!! 比方Jquery mobile,里面非常频繁的使用了这个属性; 这个属性是哪里来的-.当然 ...
- HTML5新标签与特性---新表单+新属性----综合案例1
HTML5新标签与特性 兼容性问题 (ie9 以上的版本) 文档类型设定 document HTML: sublime 输入 html:4s XHTML: sublime 输入 html:xt HTM ...
- html5: 新特性(表单)
表单: 在html4中,表单内的从属元素必须写在表单内部.在html5中,可以吧他们书写在页面任何位置,然后指定form属性,属性值为表单ID,这样就指定表单了. formaction,formmet ...
随机推荐
- C语言回顾-指针
1.指针:地址 指针变量:存放指针的变量 指针变量的定义:数据类型 *指针变量名 或者 数据类型* 指针变量名 指针变量的初始化:int *p=&a;int *p=NULL;(不能先定义后初始 ...
- Beginner's Guide to Python-新手指导
Refer English Version: http://wiki.python.org/moin/BeginnersGuide New to programming? Python is free ...
- [ASP.NET MVC] Real-time之HTML5 服务器发送事件(server-sent event)
最近有时间,打算看看SignalR,顺便了解一下Server Sent Events. Controller 输出的数据格式为:data:[数据]\n\n.输出的数据尝试8000多字符也没问题,具体的 ...
- 下拉菜单demo---参考阿里云首页顶部下拉菜单
前言: 最近开始学习html+css,准备仿照各大网站写一些demo. 正文: 分析阶段: 如下图: 链接来自于: 阿里云:https://www.aliyun.com/ 实现过程: (一)用css3 ...
- MVC3.0 项目升级到 MVC4.0
按照 http://www.asp.net/whitepapers/mvc4-release-notes#_Toc303253806 的步骤 第一步:修改web.config 注意,默认的MVC3网站 ...
- 基于layerpage 前后端异步分页
#下载jquery 和 layerpage1.核心分页方法 laypage({ cont: 'page1', //容器.值支持id名.原生dom对象,jquery对象. pages: json.tot ...
- ES数据-MySql处理Date类型的数据导入处理
用ES的小伙伴们,相信大家都遇到过Mapping处理Date类型的数据头疼问题吧. 不用头疼了,我来给你提供一种解决方案: 1.Maping定义为: { "mappings": ...
- ORACLE表的恢复
对误删的表,只要没有使用PURGE永久删除选项,那么从flash back区恢复回来希望是挺大的.一般步骤有: 1.从flash back里查询被删除的表 select * from ...
- Tomcat去除项目名称和端口号,直接使用ip地址访问项目的方法
网站开发过程中,一般的工程访问路径是 http://112.74.51.37/projectName如何设置成http://112.74.51.37/ 解决方法: 首先,进入tomcat的安装目录下的 ...
- 【原】十分钟搞定pandas
http://www.cnblogs.com/chaosimple/p/4153083.html 本文是对pandas官方网站上<10 Minutes to pandas>的一个简单的翻译 ...