下面的HTML代码在Edge(Windows)中呈现时,会在字段中显示一个"显示密码"按钮:

Password: <input type="password" />

Password field rendered in Edge 123.0.2420.65

然而,Chrome并没有出现同样的情况:

Password field rendered in Chrome 123.0.6312.86

有没有什么方法可以为我们的用户启用这种行为(可能通过一些HTML属性或CSS规则)?或者,让这个功能跨浏览器工作的唯一方法仍然是自己开发它?

我猜"显示按钮"是Edge's original feature.但我发现一些老消息来源说,该功能也会出现在其他Chromium浏览器上:

...但已经过了5年了,Chrome默认情况下似乎并没有启用这样的功能.有没有人知道它是否曾经发布到Chrome的稳定版本?也许默认情况下没有启用,但有一些方法可以为某些字段启用它?

推荐答案

TL:DR;你(目前)将不得不自己实现它.

specification中没有太多关于密码输入应该如何呈现,除了模糊值(强调是我的):

输入元素表示元素值的一行纯文本编辑控件.The user agent should obscure the value so that people other than the user cannot see it.

也没有指定隐藏密码的方法

Html相关问答推荐

springBoot + Thymeleaf:基于Locale设置页面语言

子元素以元素X开始和结束的元素的XPath?

背景可点击,而不是文本

使用响应迅速的网格系统,将两列保持在同一行,同时允许更多列用于更大的屏幕

SVG动画只有在打开S开发工具的浏览器时才开始播放

CSS Grid:使网格行填充屏幕,将下一行推离屏幕

如何在R中渲染Quarto文档时动态设置html文件名

高度:适合-内容不拉伸以适合内部长度

阴影部分内部的ionic Select 元素

rvest: Select 不包含链接的段落(<;p>;)

配置了 HTML 视口的 Google Apps 脚本移动网络应用程序无法正确显示

Angular MatBadge 在高于 99 时不显示完整数字

调整 Rmarkdown 输出的 html_document 的标题和副标题之间的间距

如果使用复选框属性更改,如何防止事件更改?

如何将内容放置在侧边栏旁边?

这两个CSS中的网格居中对齐内部盒子有什么区别?

如何从另一个 ng-template 获取输入值

让 Iframe 覆盖整个页面

HTML 标记未在页面上展开

沿文本对齐双引号