如何在单击时清除文本字段并更改其颜色

How to clear a text field on click and also change it's color

本文关键字：颜色 字段 文本 单击 清除      更新时间：2023-09-26

我有一个搜索文本框，初始值为"搜索"，颜色为灰色。

单击它时，我想清除文本并将颜色设置为黑色，以便当用户统计键入时，它是黑色的。

到目前为止，我有这个，它清除得很好。我试图向其添加 css 样式，但它给了我一个语法错误：该属性缺少命名空间后面的属性名称。

 onfocus="if(this.value == 'Search') { this.value = ''; }" onblur="if(this.value == '') { this.value = 'Search'; }"
 onfocus="if(this.value == 'Search') { this.value = ''; style="color: #000000;"; }" onblur="if(this.value == '') { this.value = 'Search'; }"

如果您不想支持 IE9 及更低版本，那么

您应该将占位符属性与一些 CSS 一起使用，例如

input::-webkit-input-placeholder { color: #555; }
input::-moz-placeholder { color: #555; }
input:-ms-input-placeholder { color: #555; }
input:-moz-placeholder { color: #555; }
<input type="text" placeholder="Search" />

设置颜色的正确方法是更改 DOM 元素的样式属性上的颜色属性，因此类似于

 this.style.color = ...

因此，如果您想支持IE9或类似的东西

<input onfocus="if (this.value == 'Search') { this.value = ''; this.style.color = '#000000'; }" onblur="    if (this.value == '') { this.value = 'Search'; this.style.color = 'red'; }" value="Search" style="color: red" />

否则，Ankit的答案将是正确的方式

相关文章：