javascript - 当我们将鼠标悬停在输入类型文本上时如何显示占位符

Question

我希望当我们将鼠标悬停在文本框上时占位符可见。

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

Answer 1

目前无法将功能内置到浏览器中，但通过一些小技巧，这是可能的:

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: transparent;
}
::-moz-placeholder { /* Firefox 19+ */
  color: transparent;
}
:-ms-input-placeholder { /* IE 10+ */
  color: transparent;
}
:-moz-placeholder { /* Firefox 18- */
  color: transparent;
}
:hover::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #999;
}
:hover::-moz-placeholder { /* Firefox 19+ */
  color: #999;
}
:hover:-ms-input-placeholder { /* IE 10+ */
  color: #999;
}
:hover:-moz-placeholder { /* Firefox 18- */
  color: #999;
}

<input type="text" placeholder="Enter your name" />

还要注意浏览器的兼容性。