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

我猜我必须专门针对Chrome。

有解决方案吗?

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


当前回答

和我在angular 5中应用的一样。

我创建了一个新的字符串来存储占位符

newPlaceholder:string;

然后我在输入框上使用了焦点和模糊函数(我使用的是素数ng自动完成)。

上面的占位符是从typescript中设置的

我用的两个函数是-

/* Event fired on focus to textbox*/
Focus(data) {
    this.newPlaceholder = data.target.placeholder;
    this.placeholder = '';
}
/* Event fired on mouse out*/
Blur(data) {
    this.placeholder = this.newPlaceholder;
}

其他回答

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');
});

任何版本的Angular

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

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

在课堂上使用

<input class="hide_placeholder"

下面这段CSS对我来说很有用:

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

}

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

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

有时你需要特异性来确保你的风格应用于最强的因素id,谢谢@Rob Fletcher的精彩回答,在我们公司我们使用过

因此,请考虑添加带有应用程序容器id前缀的样式

#app input:focus::-webkit-input-placeholder, #app textarea:focus::-webkit-input-placeholder { 颜色:# FFFFFF; } #app input:focus:-moz-placeholder, #app textarea:focus:-moz-placeholder { 颜色:# FFFFFF; }