这是自动完成的每个浏览器,除了Chrome。

我猜我必须专门针对Chrome。

有解决方案吗?

如果不是用CSS,那么用jQuery?


当前回答

使用SCSS和http://bourbon.io/,这个解决方案简单,优雅,并适用于所有的web浏览器:

input:focus {
  @include placeholder() {
    color: transparent;
  }
}

用波旁威士忌!这对你有好处!

其他回答

任何版本的Angular

只需将其添加到.css文件中

.hide_placeholder:focus::placeholder {
  color: transparent;
}

在课堂上使用

<input class="hide_placeholder"

使用SCSS和http://bourbon.io/,这个解决方案简单,优雅,并适用于所有的web浏览器:

input:focus {
  @include placeholder() {
    color: transparent;
  }
}

用波旁威士忌!这对你有好处!

这是一个css的解决方案(目前,只适用于WebKit):

input:focus::-webkit-input-placeholder {
    opacity: 0;
}

演示在这里:jsfiddle

试试这个:

//auto-hide-placeholder-text-upon-focus
if(!$.browser.webkit){
$("input").each(
        function(){
            $(this).data('holder',$(this).attr('placeholder'));
            $(this).focusin(function(){
                $(this).attr('placeholder','');
            });
            $(this).focusout(function(){
                $(this).attr('placeholder',$(this).data('holder'));
            });

        });

}

HTML:

<input type="text" name="name" placeholder="enter your text" id="myInput" />

jQuery:

$('#myInput').focus(function(){
  $(this).attr('placeholder','');
});
$('#myInput').focusout(function(){
  $(this).attr('placeholder','enter your text');
});