Question

我的网站有登录表单。此登录表单有两个文本字段，用户名和密码。目前我在文本字段之前放置标签（用户名，密码）。但现在我想删除这两个标签，并希望在文本字段中显示文本（用户名，密码）。当用户关注这些文本字段时，应删除文本，用户可以输入所需的用户名和密码。

我还注意到，当用户打开登录表单时，填写在文本字段（用户名，密码）中的文本（用户名，密码）的字体颜色是不同的颜色，当用户开始在该字段中键入时，之前的文本被删除，新的字体颜色是黑色。

怎么可能？

Answer 1

您可以使用jQuery插件，例如此one或此one

这些可以满足您的需求，我认为它们也支持单独的水印样式。

Answer 2

有关使用YUI3和jQuery（但不能同时使用）的可访问示例，请参阅http://dorward.me.uk/tmp/label-work/，我将在某个阶段正确记录。

基本上，使用CSS将标签放在输入下，并使用JS来翻转它上面的类。

（更常见的方法是使用JS更改输入的值，但这有可访问性问题）

Answer 3

您需要在html / php / asp文件中为您的用户名和密码字段设置'value'。在CSS中设置默认样式，颜色为灰色。

然后你需要为for元素设置onFocus代码。您需要将其设置为

this.value = ''; this.style.color = 'black'

您可能还想为onBlur（当剩下方框时）提供一些代码来检查该字段是否为空，然后执行类似的操作

if(this.value == ''){ this.value = 'User Name'; this.style.color = 'grey' }

Answer 4

设置值对于用户名字段很好，但是当您尝试对密码字段执行相同操作时会遇到各种问题;它不是我推荐的方法。

正如CeeJeeB建议的那样，will完全符合您的需求