移动端使用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中,表单能够包含的元素 ...
随机推荐
- css圆环百分比
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 《Web 开发基础》专题系列
说在前头 Web的重要性我想不必我多说了,写这篇文章的目的主要是想分享一些我学习Web前端开发的知识积累,其中以JavaScript为主,比较适合新人看,也欢迎大牛们多多留言提提意见. ...
- paip.批处理清理java项目冗余jar的方法
paip.批处理清理java项目冗余jar的方法 在myeclipse中开发的java项目遇到jar包冗余情况,如何删除项目中的冗余jar包啊?项目很大jar包一百多个. 2010-09-14 14: ...
- VS2010几款超赞的扩展辅助工具总结
详情请查看http://www.aehyok.com/Blog/Detail/72.html 个人网站地址:aehyok.com QQ 技术群号:206058845,验证码为:aehyok 本文文章链 ...
- HOWTO - 压缩封装的Setup.exe(纯MSI)安装包获取运行Log
在InstallShield中我们有时即使选择Basic MSI工程,但有时还是将MSI封装到Setup.exe中交付. 那么出现运行异常如何获取Log,可以用下面的方法: Setup.exe /v& ...
- malloc钩子和内存泄漏工具mtrace、Valgrind
一:malloc钩子函数 static void* (* old_malloc_hook) (size_t,const void *);static void (* old_free_hook)(vo ...
- Xiaomi 手机
- Linux: Set OR Change The Library Path
Linux: Set OR Change The Library Path by NIX CRAFT on APRIL 9, 2010 · 3 COMMENTS· LAST UPDATED AUGUS ...
- ios app 提交评审注意事项
在网络上看到的一个文档是这样写,原文的出处无法确认了 基本要点 · 不能导致手机故障(比如崩溃或屏幕问题) · 长时间/过度使用之后反应仍然很快 · 应 ...
- 用thinkphp将网络上的图片下载到本地服务器
我用的thinkphp版本是3.2.3,这个版本的跟更早些版本的调用方法不太一样,正确的调用方法是: Demo3Controller.class <?php namespace Home\Con ...