去掉html导航原点占位符,焦点在Chrome清除HTML5占位符属性文字(Clear HTML5 placeholder at...

有没有什么办法可以清除placeholder焦点在Chrome的文字，Firefox的清除焦点的文本，但Chrome不。

这混淆了用户在酒吧的文本是类型化的，或者它是一个占位符文本(即使我改变文字颜色为浅灰色)，我不想使用不必要的JavaScript或jQuery的这一点，我想知道有一些HTML / CSS解决此

演示小提琴

Chrome浏览器预览 (焦点)

Firefox的预览 (焦点)

Answer 1:

尝试使用

input:focus::-webkit-input-placeholder

{

color: transparent;

}

这将解决这个问题。 该文本是由于自动对焦在页面加载焦点可见。

Answer 2:

现在，Firefox的工作在其他的方式，所以我用这个代码：

input:focus::-webkit-input-placeholder{

color: transparent!important;

}

input:focus::-moz-placeholder{

color: transparent!important;

}

input:focus:-moz-placeholder{

color: transparent!important;

}

Answer 3:

这是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');

});

}

});

Answer 4:

我发现Shubhanshu的解决方案并没有为我工作，但我没有找到这对CSS技巧 ，在Chrome浏览器所做的工作，那并不似乎在FF工作虽然。

[placeholder]:focus::-webkit-input-placeholder {

color: transparent;

}

文章来源: Clear HTML5 placeholder attribute text on focus in Chrome