移动端使用HTML5表单增强体验
我们知道,HTML5新增了许多表单类型,如: number,email,url,tel,datetime,month,datetime-local等等,像datetime,month这些非常方便,免得自己去写选择日期,时间插件;但是像number,tel,email,这些在桌面端变化不是特别大,外观跟text一样,但是在移动端有点不同,大部分移动设备都是使用虚拟键盘,当我们使不同类型表单时,它会切换到相应的输入模式,如:number

输入法直接切换数字模式;
如:Email:

有没有看到,下面多了一个@符号;
这个变化在移动端非常方便,免得我们去切换模式;
在做开发的时候,尽量使用相应的表单类型,在桌面端或许变化不是很大,但是在移动端体验就非常棒,现在有个概念就是“移动优化”;
移动端使用HTML5表单增强体验的更多相关文章
- Dynamics CRM2015 Update1 新功能之表单增强功能
CRM2015 Update 1发布后,系统的界面的变化很大,仔细观察后会发现表单窗体也有些不同了,在CRM2015 Update1的官方介绍中对此变化的解释是起用了新的窗体呈现引擎,让界面更好看加载 ...
- HTML5表单增强
感觉最大的改变就是表单元素可以不写在form标签中.写在其他地方,加个form属性就能提交了别的嘛感觉没什么,表单验证也不能提示信息,感觉不实用 <!DOCTYPE html> <h ...
- [H5表单]html5自带表单验证体验优化及提示气泡修改
慕课网之前录制的视频,js/jquery各种宽高的理解和应用,最近终于上线了.还有一个html5左侧导航没有上线!最近慕课网系列课程让我录制一个html5表单验证的课程.今天就稍微说一下表单验证!另外 ...
- html5表单验证
表单验证为终端用户检测无效的数据并标记这些错误,是一种用户体验的优化. 下面展现浏览器自带的验证功能也可在移动端中查看: HTML部分: <!DOCTYPE html> <html ...
- jQuery 浮动标签插件,帮助你提升表单用户体验
浮动标签模式(Float Label Pattern)是最新流行的一种表单输入域的内容提示方式,当用户在输入框输入内容的时候,原先占位符的内容向上移动,显示在输入的内容的上面.这里推荐的这款 jQue ...
- html5 app开发重大消息-腾讯在技术端推进Html5生态发展
中新网5月3日电 日前,腾讯正式发布腾讯浏览服务(Tencent Browser Service,以下简称TBS),宣布为合作伙伴提供整合腾讯底层技术.内容框架.广告体系以及大数据等多方面能力的升级浏 ...
- 实现跨浏览器html5表单验证
div:nth-of-type(odd){ float: left; clear: left; } .origin-effect > div:nth-of-type(even){ float: ...
- HTML5表单及其验证
随笔- 15 文章- 1 评论- 115 HTML5表单及其验证 HTML表单一直都是Web的核心技术之一,有了它我们才能在Web上进行各种各样的应用.HTML5 Forms新增了许多新控件及其A ...
- HTML5 表单元素和属性
HTML5 表单元素和属性学习 版权声明:未经博主授权,内容严禁转载 ! 表单元素简介 无论实现提交功能还是展示页面功能,表单在HTML中的作用都十分重要. 在其他版本的HTML中,表单能够包含的元素 ...
随机推荐
- NodeJS系列~目录
回到占占推荐博客索引 Node.js官网对它的阐述 Node.js is a platform built on Chrome's JavaScript runtime for easily buil ...
- Nagios学习笔记三:配置Nagios
1.Nagios的主配置文件 Nagios的主配置文件为nagios.cfg,其语法非常简洁,通常#开头的行为注释行,而参数的设置格式为<parameter>=<value>: ...
- paip.spring 获取bean getBean 没有beanid的情况下
paip.spring 获取bean getBean 没有beanid的情况下 spring能自动扫描带有注解的bean文件.. 作者Attilax 艾龙, EMAIL:1466519819@q ...
- iOS数据持久化-OC
沙盒详解 1.IOS沙盒机制 IOS应用程序只能在为该改程序创建的文件系统中读取文件,不可以去其它地方访问,此区域被成为沙盒,所以所有的非代码文件都要保存在此,例如图像,图标,声音,映像,属性列表,文 ...
- 在主方法中定义一个大小为50的一维整型数组,数组i名为x,数组中存放着{1,3,5,…,99}输出这个数组中的所有元素,每输出十个换一行
package hanqi; import java.util.Scanner; public class Test7 { public static void main(String[] args) ...
- Codeforces Round #379 (Div. 2) 总结分享
前言 初入acm的新手,打算在cf混.这几天没有比赛,就做了个最新的Virtual participation.虽然说div2比较简单,但还是被虐得体无完肤...Orz.两个小时,共6道题.最后只AC ...
- windows10 qt5 mingw32编译cryptopp563
windows10 qt5 mingw32编译cryptopp563 参考链接: http://www.qtcentre.org/threads/28809-Compiling-amp-using-C ...
- C#:WebBrowser中伪造referer,为何对流量统计器无效?
使用webbrowser伪造referer的方法:webBrowser1.Navigate(url, "_self", null, "Referer:http://www ...
- Revit中将倾斜轴线显示为正交模式
Revit建模过程中有时候会遇到某些特殊的建筑不规则建筑或者其轴线视图中并非正交二是倾斜的情况,用Revit建模过程中对于倾斜的建筑不仅不符合人的视觉习惯,而且也会对后期的机电管线的布设造成困扰,稍不 ...
- ZooKeeper快速搭建
原文地址:http://nileader.blog.51cto.com/1381108/795230 下载PDF版本 本文是ZooKeeper的快速搭建,旨在帮助大家以最快的速度完成一个ZK集群的搭建 ...