HTML5 input date 移动端 IOS 不支持问题
1、placeholder 问题解决方法
对 input type date 使用 placeholder 的目的是为了让用户更准确的输入日期格式,iOS 上会有 date 不会显示 placeholder 文字,但是为了统一表单外观,往往需要显示。Android 部分机型没有 date 也不会显示 placeholder 文字。
解决方法:
先使其 type 为 text,此时支持 placeholder,当触摸或者聚焦的时候,使用 JS 切换使其触发 datepicker 功能。
<input placeholder="Date" class="textbox-n" type="text" onfocus="(this.type='date')" id="date">
但是在iphone 4s 上点击选择过后,还是有小问题,样式依然是默认样式,正在寻求解决方法。
这次解决方法借鉴http://www.w3cmark.com/2015/405.html
等找到好的方法,再补充。
HTML5 input date 移动端 IOS 不支持问题的更多相关文章
- HTML5 input date属性引起的探索——My97DatePicker(日期选择插件)
不得不说H5的input date属性真的好用,之前我写的http://www.cnblogs.com/tu-0718/p/6729274.html这篇博客里面也有提到,不过虽然移动端对H5的支持还是 ...
- 使用 HTML5 input 类型提升移动端输入体验(键盘)
在最近的项目中,策划老是要求我们弹出各种类型的键盘,特别是在iOS下,例如输入帐号的时候,不应该支持输入中文,该输入纯数字的时候就应该谈数字键盘等.个人觉得这些都是我们平时开发很少意识到的,虽然有些刁 ...
- 使用MUI的日期控件引起的探索——HTML5 input类型date属性
我写移动端的页面会用到MUI这个框架,个人觉得挺好用的,有很多实用的UI组件.当然坑还是有的,http://dev.dcloud.net.cn/mui/ui/ MUI官网,有兴趣的小伙伴可以看看 虽然 ...
- 使用 HTML5 input 类型提升移动端输入体验(转翻译)
在过去的几年里,在移动设备上浏览网页已变得难以置信的受欢迎. 但是这些设备上的浏览体验,有时遗留很多的有待改进.当涉及到填写表单时,这一点尤为明显.幸运的是,HTML5规范引入了许多新input类型, ...
- 使用 HTML5 input 类型提升移动端输入体验
在过去的几年里,在移动设备上浏览网页已变得难以置信的受欢迎. 但是这些设备上的浏览体验,有时遗留很多的有待改进.当涉及到填写表单时,这一点尤为明显.幸运的是,HTML5规范引入了许多新input类型, ...
- input date 支持placeholder属性
第一种解决方法:IE,火狐浏览器,不支持input date的日历功能,火狐支持日历功能 ie,火狐,谷歌显示placeholder属性 css代码 #dateofday:before{ col ...
- Swift3.0服务端开发(一) 完整示例概述及Perfect环境搭建与配置(服务端+iOS端)
本篇博客算是一个开头,接下来会持续更新使用Swift3.0开发服务端相关的博客.当然,我们使用目前使用Swift开发服务端较为成熟的框架Perfect来实现.Perfect框架是加拿大一个创业团队开发 ...
- HTML5 INPUT新增属性
HTML5的input标签新增了很多属性,也是让大家非常兴奋的一件事,用简单的一个属性搞定以前复杂的JS验证.input新增的这些属性,使得html和js的分工更明确了,使用起来十分舒畅.我们先看下i ...
- html5 canvas 画图移动端出现锯齿毛边的解决方法
使用HTML5的canvas元素画出来的.在移动端手机上测试都发现画图有一点锯齿问题 出现这个问题的原因应该是手机的宽是720像素的, 而这个canvas是按照小于720像素画出来的, 所以在720像 ...
随机推荐
- element -validateField校验提示
<el-form :model="numberValidateForm" ref="numberValidateForm" :rules="ru ...
- OS---文件结构
1.概述 1.1 对于任何一个文件,都存在以下2种形式结构: 文件的逻辑结构: 从用户的角度出发所观察到的文件组织形式,独立于文件的物理特性: 文件的物理结构(文件存储结构): 文件在外存上的存储组织 ...
- Android NDK开发 Jni中打日志LOG(二)
HelloJni.c文件中,加入头文件和函数声明.最终文件如下: #include <jni.h> #include <string.h> #include<androi ...
- android通过Jni加载so库遇到UnsatisfiedLinkError问题!!!
错误信息: java.lang.UnsatisfiedLinkError: hsl.p2pipcam.nativecaller.NativeCaller at hsl.p2pipcam.manager ...
- RTT设备与驱动之PIN设备
单片机的PIN有2个基本功能:GPIO和AFIO,其中gpio的常用功能: 1 输入:上拉.下拉.模拟.浮动 2 输出:上拉.下拉.推挽.开漏 3 中断:上升沿.下降沿.双沿.高电平.低电平触发 RT ...
- 8597 石子划分问题 dpdp,只考虑第一次即可
8597 石子划分问题 时间限制:500MS 内存限制:1000K提交次数:155 通过次数:53 题型: 编程题 语言: G++;GCC;VC Description 给定n个石子,其重量分别 ...
- 35、XPath的使用示例
使用Xpath获取页面元素 [参见W3C官网说明] http://www.w3school.com.cn/xpath/xpath_syntax.asp 以下Xpath路径都是获取下面地址的元素 ...
- 新浪微博OAuth2授权错误 error:redirect_uri_mismatch
最近想在app进行新浪微博认证,结果发现总是报error:redirect_uri_mismatch错误. 网上搜了解决方法. 进入 http://open.weibo.com/apps/app_ke ...
- #if #endif #elif #undef
#define aaa //放在代码最前面 int a = 1; a = a + 1; #if !aaa {a = a + 1;}#elif !aaaaa {a=a+11;}#en ...
- linux 查看防火墙状态
1.查看防火墙状态 systemctl status firewalld firewall-cmd --state #查看默认防火墙状态(关闭后显示notrunning,开启后显示running) 2 ...