Question

我重新设计了公司页面，根据我们的设计机构推荐，我们的字段没有标签，所以我在下面有以下字段：

<input type="text" name="userid" value="User ID" />
<input type="text" name="passFake" value="Password" />
<input type="password" name="passReal" value="" />

因此，当用户进入页面时，“假”密码字段可见，并且“真实”密码字段被隐藏，并且用户看到两个带有标签的字段，基本上是在字段内。使用Javascript，我可以在焦点上隐藏假密码字段并显示真实密码字段，以便用户在密码字段中输入密码。

但是，如果用户使用密码管理器，并且之前在我们的网站上记录了他们的密码，则会遇到问题。我怀疑密码管理器工具正在通过javascript修改字段而不设置焦点，所以他们只是在假密码字段中填充用户的密码。

这有两个副作用：

用户的密码正在显示，因为它被输入到“文本”字段，而不是密码字段
用户无法登录，因为密码被放入错误的字段

我无法在家用计算机上安装密码管理器，因为公司计算机上不允许这样做，所以我可以假设如果我将onchange事件附加到假密码字段吗？或者我是关于密码管理器如何工作不正确的假设？

Answer 1

更改HTML标记以创建表现效果可能会在以后咬你。

为什么不像往常一样为输入创建标签，通过CSS将它们放在输入的顶部，然后设置为在点击时或输入获得焦点时隐藏它们？这应该解决密码管理器的问题，因为它们不会是一个虚假的领域阻碍它。

我在这里举了一个例子：

http://jsfiddle.net/hellslam/jk5Bv/10/

密码管理器在重新设计后不再适用于密码字段

1 个答案: