如何隐藏焦点上的占位符文本：CSS 与 jQuery？

隐藏焦点上的占位符文本：CSS 或 jQuery 解决方案

除了 Chrome 之外，所有浏览器都原生支持自动隐藏焦点上的占位符文本。为了实现此功能，可能需要专门针对 Chrome。以下是一些解决方案：

基于 CSS 的解决方案

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

基于 jQuery 的解决方案

$('input').on('focus', function() {
  $(this).attr('placeholder', '');
});

$('input').on('blur', function() {
  var placeholder = $(this).attr('placeholder-text');
  if (!placeholder) {
    placeholder = $(this).attr('placeholder');
  }
  $(this).attr('placeholder', placeholder);
});

注意上述 CSS 解决方案现在已被所有现代浏览器支持，包括 Chrome。然而，jQuery 解决方案在某些场景中可能仍然有用，例如在焦点丢失时提供自定义占位符消息。

以上是如何隐藏焦点上的占位符文本：CSS 与 jQuery？的详细内容。更多信息请关注PHP中文网其他相关文章！