有没有办法在 Chrome 中清除焦点上的placeholder
文本,火狐会清除焦点上的文本,但Chrome不会。
这使用户感到困惑,无论栏中的文本是键入的,还是占位符文本(即使我将文本颜色更改为浅灰色),我不想为此使用不必要的JavaScript或jQuery,我想知道是否有一些HTML/CSS解决方案
Chrome预览(焦点)
Firefox预览(焦点)
发布于 2012-10-10 22:28:50
尝试使用
input:focus::-webkit-input-placeholder
{
color: transparent;
}
它会解决这个问题。文本在焦点上是可见的,因为页面加载时会自动聚焦。
发布于 2013-08-16 15:57:37
现在firefox以另一种方式工作,所以我使用了以下代码:
input:focus::-webkit-input-placeholder{
color: transparent!important;
}
input:focus::-moz-placeholder{
color: transparent!important;
}
input:focus:-moz-placeholder{
color: transparent!important;
}
发布于 2012-10-10 22:27:53
这就是chrome处理它的方式,chrome用户可能会期望它是这样处理的。但是,当“占位符”属性被关注时,您可以使用jQuery删除该属性。
我为你找到了一个明显的修复方法,来自谷歌群@ https://github.com/mathiasbynens/jquery-placeholder/issues/51#issuecomment-4193018
// Fixing Webkit that not clearing input/textarea when get focus
$(function(){
if ($.browser.webkit) {
$('input, textarea').on('focus',function(){
if ( $(this).attr('placeholder') ) $(this).data('placeholder', $(this).attr('placeholder')).removeAttr('placeholder');
}).on('blur', function(){
if ( $(this).data('placeholder') ) $(this).attr('placeholder', $(this).data('placeholder')).removeData('placeholder');
});
}
});
https://stackoverflow.com/questions/12821746
复制相似问题