Javascript 在不同的事件上应用不同的样式？

这是我的

输入

。它有两个事件

onblur

和

onfocus

。我想为不同的事件应用不同的样式规则。例如：

style=“color:black；”“

用于

onfocus

和

style=“color:red；”“

用于

onblur

---

我将如何做到这一点？

我建议使用纯CSS解决方案-它更简单、更干净

HTML

<input type="text" class="home" value="google.com" onblur="if(this.value=='')
{this.value='google.com'}" onfocus="if(this.value=='google.com'){this.value=''}" />

一旦控件失去焦点，它将自动恢复到原始状态。或者，就像我想说的那样，是自动的

给你

其他信息

---

请参见

我建议使用纯CSS解决方案-它更简单、更干净

HTML

<input type="text" class="home" value="google.com" onblur="if(this.value=='')
{this.value='google.com'}" onfocus="if(this.value=='google.com'){this.value=''}" />

一旦控件失去焦点，它将自动恢复到原始状态。或者，就像我想说的那样，是自动的

给你

其他信息

请参见

不过，我还是推荐詹姆斯·希尔的解决方案。

---

不过，我推荐James Hill的解决方案。

您甚至不需要使用Javascript来实现这一点。CSS有一个焦点伪类，可以用于输入字段

<input type="text" class="home" value="google.com" 
       onblur="if(this.value==''){this.value='google.com'; this.style.color = 'red'}"
       onfocus="if(this.value=='google.com'){this.value=''; this.style.color = 'black'}" />

---

“onblur”状态只是成为默认的输入类选择器。

您甚至不需要使用Javascript进行此操作。CSS有一个焦点伪类，可以用于输入字段

<input type="text" class="home" value="google.com" 
       onblur="if(this.value==''){this.value='google.com'; this.style.color = 'red'}"
       onfocus="if(this.value=='google.com'){this.value=''; this.style.color = 'black'}" />

“onblur”状态只是成为默认的输入类选择器

input.home { color: black }
input.home:focus { color: red }