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

我猜我必须专门针对Chrome。

有解决方案吗?

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


当前回答

$("input[placeholder]").each(function () {
    $(this).attr("data-placeholder", this.placeholder);

    $(this).bind("focus", function () {
        this.placeholder = '';
    });
    $(this).bind("blur", function () {
        this.placeholder = $(this).attr("data-placeholder");
    });
});

其他回答

除此之外,我有两个想法。

您可以添加一个模仿palceholder的元素。然后使用javascript控制元素的显示和隐藏。

但它太复杂了,另一个是用兄弟的css选择器。就像这样:

.占位符{位置:绝对;字体大小:14 px;左:40像素;上图:11 px;行高:1;pointer-events:没有;} .send消息输入:焦点+ .占位符{显示:无;}

23333,我的英语很差。希望能解决你的问题。

<input 
type="text" 
placeholder="enter your text" 
onfocus="this.placeholder = ''"
onblur="this.placeholder = 'enter your text'" />

和我在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;
}

任何版本的Angular

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

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

在课堂上使用

<input class="hide_placeholder"

如果您的输入背景颜色是白色,那么您可以将占位符文本的颜色设置为焦点,以匹配输入背景-使文本不可见;从理论上讲。如果你的输入是不同的颜色,那么只需简单地改变颜色以匹配它。

input:focus::placeholder {
  color: white;
}

此外,您可以将颜色设置为“透明”,如其他答案所示。