占位符不会在Chrome中聚焦时消失

我今天遇到了同样的问题,我提出了一个纯CSS 解决方案 破解:

input:focus::-webkit-input-placeholder {
    color: transparent;
}

Firefox和chrome(以及safari)在HTML5占位符上的作用不同。如果您希望chrome使焦点上的占位符消失,您可以使用以下脚本:

$('input:text, textarea').each(function(){
    var $this = $(this);
    $this.data('placeholder', $this.attr('placeholder'))
         .focus(function(){$this.removeAttr('placeholder');})
         .blur(function(){$this.attr('placeholder', $this.data('placeholder'));});
});

您可以使用这个占位符jquery插件: placeholderFix 。 有了这个插件,占位符标记将在所有浏览器中以相同的方式工作,在不支持它的浏览器中也是如此。