密码字段的水印文本

问题描述:

我在页面上有一个密码字段.我想在输入密码之前在屏幕上的密码字段中显示水印文本输入密码",它将文本显示为密码类型.我们如何使用javascript解决这个问题?

I have one password field on page. I want to display watermark text "Enter password" in password field on screen before entering password it shows the text as password type. How we can resolve this issue by using javascript?

最简单的方法是使用 jQuery 插件,该插件允许对密码字段添加水印.我想出了 这个插件 进行快速谷歌搜索.

The easiest way is going to be to use a jQuery plugin that allows watermarking of password fields. I came up with this plugin doing a quick google search.

如果您不想使用 jQuery 插件,您需要的是 2 个 html 输入,一个可见,一个隐藏.隐藏的包含您想要传递回服务器的实际值,而可见的则是您使用 javascript 操作并且用户与之交互的值.下一部分是一起操作 2 个输入.以下是我能想到的重要代码部分:

If you don't want to use a jQuery plugin, what you're going to need is 2 html inputs, one visible and one hidden. The hidden one contains the actual value you're wanting to pass back to the server while the visible one is the one you manipulate with javascript and the user interacts with. The next part is to manipulate the 2 inputs together. Here's the important parts that I can think of to code for:

  • 当您的可见密码输入为空时,将其类型更改为文本并显示水印,但将隐藏的输入留空.
  • 如果用户给它焦点,隐藏水印并切换回密码.
  • 在他们输入时,将值复制到隐藏字段中.
  • 如果他们离开输入并且没有文本,则将类型切换回文本并再次显示水印.

尝试使用插件或自己编写 javascript 代码,然后告诉我进展如何.

Try either the plugin or coding the javascript yourself and let me know how it goes.