任何版本的Angular

只需将其添加到.css文件中

.hide_placeholder:focus::placeholder {
  color: transparent;
}

在课堂上使用

<input class="hide_placeholder"

Toni的答案很好，但我宁愿放弃ID并显式使用输入，这样所有带有占位符的输入都能获得行为:

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

注意$(function(){});$(document).ready(function(){})的简写:

$(function(){
    $('input').data('holder',$('input').attr('placeholder'));
    $('input').focusin(function(){
        $(this).attr('placeholder','');
    });
    $('input').focusout(function(){
        $(this).attr('placeholder',$(this).data('holder'));
    });
})

演示。

任何版本的Angular

只需将其添加到.css文件中

.hide_placeholder:focus::placeholder {
  color: transparent;
}

在课堂上使用

<input class="hide_placeholder"

我喜欢css的过渡方法。在Focus上，占位符淡出;)也适用于文本区域。

谢谢凯西·朱的好主意。

textarea::-webkit-input-placeholder, input::-webkit-input-placeholder { 
    color: #fff;
    opacity: 0.4;
    transition: opacity 0.5s;
    -webkit-transition: opacity 0.5s; 
}

textarea:focus::-webkit-input-placeholder, input:focus::-webkit-input-placeholder  { 
    opacity: 0;
}

这是一个css的解决方案(目前，只适用于WebKit):

input:focus::-webkit-input-placeholder {
    opacity: 0;
}

不需要使用CSS或JQuery。您可以直接从HTML输入标记执行此操作。

例如，在下面的邮箱中，点击里面的占位符文字会消失，点击外面的文字会重新出现。

<input type="email" placeholder="Type your email here..." onfocus="this.placeholder=''" onblur="this.placeholder='Type your email here...'">