手机端input[type=date]的placeholder不起作用
<div class="input clearfix">
<label class="fl">起始日期</label>
<input class="fl text_date" type="date" name="" value="" placeholder="年/月/日" />
</div>
<div class="input clearfix">
<label class="fl">终止日期</label>
<input class="fl text_date" type="date" name="" value="" placeholder="年/月/日" />
</div>
css:
input[type="date"]:before{
content: attr(placeholder);
color:#ccc;
}
用户选了日期以后我们模拟的默认文字还在,所以在用户选择的时候就删除此属性,之后需要的话再添加回来。
js:
$('.text_date').focus(function(){
$(this).removeAttr('placeholder');
});
$('.text_date').blur(function(){
if(this.value == ''){
$(this).attr('placeholder','年/月/日');
}
});
手机端input[type=date]的placeholder不起作用的更多相关文章
- 手机端input[type=date]的时候placeholder不起作用解决方案
目前PC端对input 的date类型支持不好,我试下来的结果是只有chrome支持.firefox.IE11 都不支持.而且PC端有很多日历控件可供使用.就不去多考虑这点了. 那么在移动端的话,io ...
- input type date 解决移动端显示placeholder
在最近的一个项目中使用到了html5的一个新标签属性,type="date"时,发现placeholder属性失效无法使用. 如果是这样的效果,那么客户体验是可想而知的差了. 最后 ...
- 关于<input type="date">这种取值的问题 【原创】
举例 <input type="date" id="date1"> var num = $("#date1").val(); a ...
- (网页)HTML中INPUT type="date"标签如何赋值注意问题(转)
现在的html5 input标签支持type="date" 显示有日期的日历控件,一行简单的代码就能显示出一个日历控件,但是有的时候需要给它一个默认的日期值,这个时候可能就要用到v ...
- html5中如何去掉input type date默认
html5中如何去掉input type date默认样式 2.对日期时间控件的样式进行修改目前WebKit下有如下9个伪元素可以改变日期控件的UI:::-webkit-datetime-edit – ...
- input时间表单默认样式修改(input[type="date"])
一.时间选择的种类: HTML代码:选择日期:<input type="date" value="2018-11-15" /> 选择时间:<i ...
- 在iPhone手机上写了input type="date" 显示不出来的原因
在iPhone手机上写了input type="date" 显示不出来的原因 今天在手机页面上使用新的input类型,这样子写,在chrome浏览器上浏览,很好,显示出来.然后用i ...
- HTML5中input[type='date']自定义样式
HTML5提供了日历控件功能,缩减了开发时间,但有时它的样式确实不如人意,我们可以根据下面的代码自行修改. 建议:复制下面的代码段,单独建立一个css文件,方便我们修改. /* 修改日历控件类型 */ ...
- <input type="date">设置默认当前日期
日期选择器如下: <input type="date" id="start_date" name="start_date"> 注 ...
随机推荐
- c#使用 Newtonsoft.Json 将entity转json时,忽略为null的属性
c#使用 Newtonsoft.Json 将entity转json时,忽略为null的属性,直接在属性上加下面的特性 [JsonProperty(NullValueHandling=NullValue ...
- socket 套接字服务器端和客户端发送信息
import socket import threading host='' port=6889 def cilenThred(conn,addr): print("成功接受客户端{}的连接 ...
- C++通过GetAdapatersInfo获取网卡配置信息
DWORD GetAdaptersInfo( PIP_ADAPTER_INFO pAdapterInfo, //指向一个缓冲区,用来取得IP_ADAPTER_INFO结构列表 PULONG pOutB ...
- Linux下CenOS系统 安装Redis
1.redis下载 进入root目录:cd /root(目录可自定义) wget http://download.redis.io/releases/redis-3.2.10.tar.gz 红色部 ...
- NeuChar 平台使用及开发教程 索引
什么是 NeuChar? NeuChar 是由盛派(Senparc)团队发布的新一代跨平台服务系统,其中包含了开放的跨平台通讯标准及核心计算模块(Senparc.NeuChar.dll)以及配套的云管 ...
- OSGi类加载流程
思路 OSGi每个模块都有自己独立的classpath.如何实现这一点呢?是因为OSGi采取了不同的类加载机制: OSGi为每个bundle提供一个类加载器,该加载器能够看到bundle Jar文件内 ...
- 为wordpress博客网站替换鼠标样式
第一种方法是使用插件来实现这个功能,Unique Cursor 插件.可以在后台直接安装启用,然后就可以设置喜欢鼠标样式,点击保存就可以了.切记在选择的同时有二个选项一个是disable意思是关闭还 ...
- #Java学习之路——基础阶段(第五篇)
我的学习阶段是跟着CZBK黑马的双源课程,学习目标以及博客是为了审查自己的学习情况,毕竟看一遍,敲一遍,和自己归纳总结一遍有着很大的区别,在此期间我会参杂Java疯狂讲义(第四版)里面的内容. 前言: ...
- #Java学习之路——基础阶段(第四篇)
我的学习阶段是跟着CZBK黑马的双源课程,学习目标以及博客是为了审查自己的学习情况,毕竟看一遍,敲一遍,和自己归纳总结一遍有着很大的区别,在此期间我会参杂Java疯狂讲义(第四版)里面的内容. 前言: ...
- [Swift]LeetCode114. 二叉树展开为链表 | Flatten Binary Tree to Linked List
Given a binary tree, flatten it to a linked list in-place. For example, given the following tree: 1 ...