javascript - 使表单中的 "helper"文本与键入文本的颜色不同

Question

<input name="phone" type="text" id="phone" value="Phone #" onfocus="value=''">

我这里有两个问题。主要是我希望帮助文本(在本例中为“电话号码”)与用户输入的文本颜色不同，以便用户更容易区分已填充和未填充的字段。

第二个是使用这种方法 (onfocus="value''") 如果您在某个字段中输入错误的内容并返回到它，您必须重新输入整个内容，这并不是真的可以接受。

Answer 1

有一个很棒的、简单的 jQuery 插件可以完全满足您的需求:

http://blog.amnuts.com/2009/02/17/text-box-hint-values-with-jquery/

它使用CSS实现了你想要的效果。

这里还有另一个简单的 jQuery 插件:

http://fuelyourcoding.com/scripts/infield/

后者提供的功能略有不同，因为水印文本会一直保留到您开始输入为止。