对于placeholder浏览器兼容性(包括密码输入框)解决办法
将以下脚本和样式引入你的页面(对于密码输入框,要设置ID属性值):
<script type="text/javascript">
$(function () {
// 如果不支持placeholder,用jQuery来完成
if (!isSupportPlaceholder()) {
// 遍历所有input对象, 除了密码框
$('input').not("input[type='password']").each(
function () {
var self = $(this);
var val = self.attr("placeholder");
input(self, val);
}
);
/**//* 对password框的特殊处理
* 1.创建一个text框
* 2.获取焦点和失去焦点的时候切换
*/
$('input[type="password"]').each(
function () {
var pwdField = $(this);
var pwdVal = pwdField.attr('placeholder');
var pwdId = pwdField.attr('id');
// 重命名该input的id为原id后跟1
pwdField.after('<input id="' + pwdId + '1" type="text" value=' + pwdVal + ' autocomplete="off" />');
var pwdPlaceholder = $('#' + pwdId + '1');
pwdPlaceholder.show();
pwdField.hide();
pwdPlaceholder.focus(function () {
pwdPlaceholder.hide();
pwdField.show();
pwdField.focus();
});
pwdField.blur(function () {
if (pwdField.val() == '') {
pwdPlaceholder.show();
pwdField.hide();
}
});
}
);
}
});
// 判断浏览器是否支持placeholder属性
function isSupportPlaceholder() {
var input = document.createElement('input');
return 'placeholder' in input;
}
// jQuery替换placeholder的处理
function input(obj, val) {
var $input = obj;
var val = val;
$input.attr({ value: val });
$input.focus(function () {
if ($input.val() == val) {
$(this).attr({ value: "" });
}
}).blur(function () {
if ($input.val() == "") {
$(this).attr({ value: val });
}
});
}
</script>
<style type="text/css">
/* 设置提示文字颜色 */
::-webkit-input-placeholder {
color: #838383;
}
:-moz-placeholder {
color: #838383;
}
.placeholder {
color: #ccc;
}
</style>
对于placeholder浏览器兼容性(包括密码输入框)解决办法的更多相关文章
- IE浏览器和Firefox浏览器兼容性问题及解决办法
IE浏览器和Firefox浏览器兼容性问题及解决办法 为了方便大家阅读代码,以下以 IE 代替 Internet Explorer,以 MF/FF 代替 Mozzila Firefox : 1.//w ...
- Aasible中cryptography兼容性报错解决办法
Aasible中cryptography兼容性报错解决办法 1 Ansible中使用ansible --version查看版本,报错信息如下: ERROR! Unexpected Exception, ...
- Eclipse中js文件修改后浏览器不能及时更新的解决办法
项目中js文件修改后浏览器不能及时更新的解决办法 转载:http://www.codeweblog.com/%E9%A1%B9%E7%9B%AE%E4%B8%ADjs%E6%96%87%E4%BB%B ...
- 在微信端使用video标签,播放结束会出现QQ浏览器推荐视频的解决办法(vue)
会出现播放结束显示QQ浏览器推荐视频的原因:(我是vue的项目,而且我是新手,只是单纯的给大家分享一个方法,代码比较low请自动忽略) 因为在x5(QQ浏览器)内核中,把video标签劫持了,只要是检 ...
- 关于IE和Firefox兼容性问题及解决办法
1.//window.eventIE:有window.event对象FF:没有window.event对象.可以通过给函数的参数传递event对象.如onmousemove=doMouseMove(e ...
- chrome浏览器font-size<12px无效解决办法
当样式设定font-size<12px时,chrome浏览器里字体显示仍为12px:如font-size:11px; 但是chrome还是12px的大小,很不听话. 今天我就遇到了这样的问题?网 ...
- linux ubuntu 浏览器 字 字体 虚 解决办法
在刚装好的ubuntu上什么都好,只是浏览器字体很虚,就连百度都虚 解决办法很简单 安装雅黑字体 修改font conf sudo vi /etc/fonts/conf.avail/69-langua ...
- win8下安装VC6出现兼容性问题的解决办法
重装系统之后(win8的系统),发现VC6安装出现兼容性问题,花了一些时间解决,有出现的问题都差不多在下面链接的总结中,写的很详细: http://www.docin.com/p-1126120829 ...
- selenium自动化打开浏览器不受信任解决办法
之前在用selenium(火狐浏览器)打开一个https网站时,总是弹出不受信任,修改配置后,每次加载的浏览器都是还原了配置,无法加载出页面,这里给出解决办法:让浏览器去加载我们修改后的配置,具体如下 ...
- 关于Nginx启动成功,浏览器不能访问的解决办法
本人初学Nginx,第一天配置成功并能通过浏览器进行访问. 第二天重新打开,将Nginx启动,但是浏览器却访问不了. 执行 ps aux|grep nginx ,执行结果如下,的确Nginx服务已经启 ...
随机推荐
- Google one联合联发科,国内低端智能机方案怎么办?
欢迎转载opendevkit文章, 文章原始地址: http://www.opendevkit.com/?e=46 Google在Google I/O大会, 发布的Android One,由于看重的是 ...
- iOS常用的忽略警告
在iOS开发过程中,偶尔会碰到一些编译器警告,如果能够确定该警告不会影响到程序的正常运行,则可以手动告诉编译器忽略掉这个警告 iOS常用的忽略警告类型: 1.方法弃用警告 #pragma clang ...
- 【AspNetCore】【WebApi】扩展Webapi中的RouteConstraint中,让DateTime类型,支持时间格式化(DateTimeFormat)
扩展Webapi中的RouteConstraint中,让DateTime类型,支持时间格式化(DateTimeFormat) 一.背景 大家在使用WebApi时,会用到DateTime为参数,类似于这 ...
- 如何实现:录制视频聊天的全过程? 【低调赠送:QQ高仿版GG 4.3 最新源码】
前段时间做个项目,客户需要将视频对话的整个过程录制下来,这样,以后就可以随时观看.想来录制整个视频聊天的过程这样的功能应该是个比较常见的需求,比如,基于网络语音视频的1:1的英语口语辅导,如果能将辅导 ...
- 在asp.net WebAPI 中 使用Forms认证和ModelValidata(模型验证)
一.Forms认证 1.在webapi项目中启用Forms认证 Why:为什么要在WebAPI中使用Forms认证?因为其它项目使用的是Forms认证. What:什么是Forms认证?它在WebAP ...
- Programming Entity Framework CodeFirst -- 约定和属性配置
以下是EF中Data Annotation和 Fluenlt API的不同属性约定的对照. Length Data Annotation MinLength(nn) MaxLength(nn) ...
- 如何用Unity GUI制作HUD
若知其所以然,自然知其然. HUD是指平视显示器,就是套在脸上,和你的眼睛固定在一起,HUD的意思就是界面咯,一般我们说HUD特指把3D空间中的界面的某些信息(比如血条,伤害之类)的贴在界面上,对应3 ...
- IOS 手势-轻点、触摸、手势、事件
1.概念 手势是从你用一个或多个手指接触屏幕时开始,直到手指离开屏幕为止所发生的所有事件.无论手势持续多长时间,只要一个或多个手指仍在屏幕上,这个手势就存在. 触摸是指把手指放到IOS设备的屏幕上,从 ...
- jQuery疑惑记录
不断更新 1.项目中有一句 this.$html = $('<div/>').html(html).attr('sspa-mod-id', this.modName).hide();不知道 ...
- ios 向工程里添加Fonts
ios 向工程里添加Fonts 1.网上搜索字体文件(后缀名为.ttf,或.odf),假如你加入的字体为微软雅黑 2.把字体库导入到工程的resouce中 3.然后在你的工程的Info.plist文件 ...