你想要这样分配给onfocus:

if (this.value == this.defaultValue)
    this.value = ''
this.className = ''

这是onblur:

if (this.value == '')
    this.value = this.defaultValue
this.className = 'placeholder'

(如果你愿意，你可以使用一些更聪明的东西，比如框架函数，来进行类名切换。)

用一些CSS像这样:

input.placeholder{
    color: gray;
    font-style: italic;
}

最好的方法是使用某种JavaScript库(如jQuery或YUI)将JavaScript事件连接起来，并将代码放在外部的.js文件中。

但如果你想要一个快速的解决方案，这是你的内联html解决方案:

<input type="text" id="textbox" value="Search"
    onclick="if(this.value=='Search'){this.value=''; this.style.color='#000'}" 
    onblur="if(this.value==''){this.value='Search'; this.style.color='#555'}" />

更新:增加了要求的着色材料。

当页面第一次加载时，让搜索出现在文本框中，如果你想要它是灰色的。

当输入框接收到焦点时，选择搜索框中的所有文本，这样用户就可以开始输入，这会在此过程中删除所选文本。如果用户想要第二次使用搜索框，这也会很好地工作，因为他们不需要手动突出显示之前的文本来删除它。

<input type="text" value="Search" onfocus="this.select();" />

使用背景图像来渲染文本:

 input.foo { }
 input.fooempty { background-image: url("blah.png"); }

然后你所要做的就是检测value == 0并应用正确的类:

 <input class="foo fooempty" value="" type="text" name="bar" />

jQuery JavaScript代码如下所示:

jQuery(function($)
{
    var target = $("input.foo");
    target.bind("change", function()
    {
        if( target.val().length > 1 )
        {
            target.addClass("fooempty");
        }
        else
        {
            target.removeClass("fooempty");
        }
    });
});

我发现jQuery插件jQuery水印比上面的答案中列出的要好。为什么好吗?因为它支持密码输入字段。此外，设置水印(或其他属性)的颜色就像在CSS文件中创建.watermark引用一样简单。

这就是所谓的文本框水印，它是通过JavaScript完成的。

http://naspinski.net/post/Text-Input-Watermarks-using-Javascript- (IE-Compatible) . aspx

或者如果你使用jQuery，一个更好的方法:

http://digitalbush.com/projects/watermark-input-plugin/ 或code.google.com/p/jquery-watermark