我正在尝试添加autocomplete=new-password https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion#Preventing_autofilling_with_autocompletenew-password某些用户编辑表单，但它无法遵循 Chrome 79 和 Firefox 71 中的正确行为。应该是两个浏览器都支持 https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#Browser_compatibility.
这是怎么回事？
我创建了两个非常简单的示例来消除对该问题的任何外部干扰。它们可以从任何 HTTP 服务器（例如php -S localhost:8999）。第一页触发“保存登录”功能，但第二页不应使用该信息来自动完成密码 - 但它确实如此。
<!-- login.htm -->
<html>
<head></head>
<body>
<form action="edit.htm" method="post">
<label>Login <input type="text" name="login" /></label></br>
<label>Password <input type="password" name="pwd" /></label><br />
<input type="submit">
</form>
</body>
</html>
<head></head>
<body>
<form>
<label>Login <input type="text" name="login" /></label></br>
<label>New Password <input type="password" name="pwd" autocomplete="new-password" /></label><br />
<input type="submit">
</form>
</body>
</html>
这并不完全是“如何使用 autocomplete=new-password”的重复，因为行为似乎已经改变或记录不全。
这似乎是浏览器强制页面以这种方式运行的一个问题/优点，并且在设置时绝对没有解决这个问题自动完成=“新密码”或者即使您将该值设置为关闭。但似乎有一种解决方法可以解决浏览器意外引起的这个问题。
- HTML方式：
您可以通过在表单顶部添加隐藏字段来分散浏览器的注意力来解决此问题
<!-- fake fields are a workaround for chrome/opera autofill getting the wrong fields -->
<input id="username" style="display:none" type="text" name="fakeusernameremembered">
<input id="password" style="display:none" type="password" name="fakepasswordremembered">
-JS方式：
您只需将密码输入设置为只读即可更改其状态
<html>
<head></head>
<body>
<form>
<label>Login <input type="text" name="login"/></label></br>
<label>New Password <input type="password" id="password" name="pwd" readonly autocomplete="new-password"/></label><br/>
<input type="submit">
</form>
<script>
document.getElementById('password').onfocus = function() {
document.getElementById('password').removeAttribute('readonly');
};
</script>
</html>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
