在密码字段中显示星号而不是无值

Posted 2023-03-05

【中文标题】在密码字段中显示星号而不是无值

【英文标题】：display asterisk instead of no value in password field

【发布时间】：2013-04-24 22:46:48

【问题描述】：

我想在密码字段中显示星号而不是没有值。 当我将字段设置为 type=text 时，我可以看到纯文本。当我将类型设置为密码时，我得到空白字段。 有没有办法将值显示为星号？

  <input type="text" id="txtPwd" runat="server" />           

这是我拥有的领域。 在此先感谢 Laziale

【问题讨论】：

也许是时候更新你的浏览器了，因为我的浏览器显示的密码字段和预期的一样 -> FIDDLE

也许我在你的问题中没有得到什么，但为什么你不能在输入 type="password" 中添加一个假值来显示星号？

您是否尝试在用户键入字符时将字符替换为星号？

你为什么不使用type="password"？为什么要重新发明***？

【参考方案1】：

您可以使用 html5 placeholder 属性：

 <input type="password" placeholder="●●●●●●●●●">

示例：http://jsfiddle.net/AJ2kn/

【参考方案2】：

如果您希望用户的文本输入被星号替换，您需要使用password 输入——text 输入不会这样做：

<input type="password" id="txtPwd" runat="server" />

但是，默认值为空白（这也适用于text 输入）。如果你想把它初始化为默认值，你可以这样做：

<input type="password" value="dummy" id="txtPwd" runat="server" />

注意：我强烈建议不要将用户密码作为密码字段的默认值！它可能会泄露您用户的密码。

如果您想在字段为空时将一些星号显示为占位符文本，您可以使用placeholder 属性（同样，这也适用于text 输入）：

<input type="password" placeholder="*****" id="txtPwd" runat="server" />