如何在不使用JS/jQuery的情况下使占位符消失？

Question

在我的搜索字段中,我只是想通了,当我点击input字段时,它一直保留到输入内容为止.我想在单击字段时隐藏占位符.

由于这个网站将被交付给另一个团队,我不想在这里添加JavaScript或jQuery代码.因为这是客户的要求之一.如何使用CSS和HTML实现它？这是HTML的默认行为.

<input type="text" value="" placeholder="Keywords or Chassis/ Reference No">

Answer 1

您可以使用选择器input:focus::placeholder:

input:focus::placeholder {
  visibility: hidden
}

<input type="text" value="" placeholder="Keywords or Chassis/ Reference No">