除此之外，我有两个想法。

您可以添加一个模仿palceholder的元素。然后使用javascript控制元素的显示和隐藏。

但它太复杂了，另一个是用兄弟的css选择器。就像这样:

.占位符{位置:绝对;字体大小:14 px;左:40像素;上图:11 px;行高:1;pointer-events:没有;｝ .send消息输入:焦点+ .占位符{显示:无;｝

23333，我的英语很差。希望能解决你的问题。

/* Webkit */
[placeholder]:focus::-webkit-input-placeholder { opacity: 0; }
/* Firefox < 19 */
[placeholder]:focus:-moz-placeholder { opacity: 0; }
/* Firefox > 19 */
[placeholder]:focus::-moz-placeholder { opacity: 0; }
/* Internet Explorer 10 */
[placeholder]:focus:-ms-input-placeholder { opacity: 0; }

试试这个函数:

+它隐藏占位符在焦点上，并返回它在模糊

+这个函数依赖于占位符选择器，首先它选择具有占位符属性的元素，触发一个聚焦函数，另一个模糊函数。

重点:它向元素添加了一个属性“data-text”，该属性从占位符属性中获取其值，然后它删除了占位符属性的值。

在模糊:它返回占位符值，并从数据文本属性中删除它

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

$('[placeholder]').focus(function() {
    $(this).attr('data-text', $(this).attr('placeholder'));
    $(this).attr('placeholder', '');
  }).blur(function() {
      $(this).attr('placeholder', $(this).attr('data-text'));
      $(this).attr('data-text', '');
  });
});

如果您通过检查输入元素来了解幕后发生的事情，您就可以很好地理解我的意思

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'));
    });
})

演示。

<input 
type="text" 
placeholder="enter your text" 
onfocus="this.placeholder = ''"
onblur="this.placeholder = 'enter your text'" />

演示在这里:jsfiddle

试试这个:

//auto-hide-placeholder-text-upon-focus
if(!$.browser.webkit){
$("input").each(
        function(){
            $(this).data('holder',$(this).attr('placeholder'));
            $(this).focusin(function(){
                $(this).attr('placeholder','');
            });
            $(this).focusout(function(){
                $(this).attr('placeholder',$(this).data('holder'));
            });

        });

}