Html 如何在 Web 表单字段/输入标签上禁用浏览器自动完成功能？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2530/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do you disable browser Autocomplete on web form field / input tag?
提问by Brett Veenstra
How do you disable autocompletein the major browsers for a specific input(or form field)?
您如何autocomplete在主要浏览器中禁用特定input（或form field）？
采纳答案by nlucaroni
Firefox 30 ignores autocomplete="off"for passwords, opting to prompt the user instead whether the password should be stored on the client. Note the following commentaryfrom May 5, 2014:
Firefox 30 忽略autocomplete="off"密码，而是选择提示用户是否应将密码存储在客户端上。请注意以下2014 年 5 月 5 日的评论：
- The password manager alwaysprompts if it wants to save a password. Passwords are not saved without permission from the user.
- We are the third browser to implement this change, after IE and Chrome.
- 密码管理器总是提示是否要保存密码。未经用户许可，不得保存密码。
- 我们是继 IE 和 Chrome 之后第三个实施此更改的浏览器。
According to the Mozilla Developer Networkdocumentation, the Boolean form element attribute autocompleteprevents form data from being cached in older browsers.
根据Mozilla Developer Network文档，布尔表单元素属性autocomplete可防止表单数据在旧浏览器中缓存。
<input type="text" name="foo" autocomplete="off" />
回答by Ben Combee
In addition to autocomplete=off, you could also have your form fields names be randomized by the code that generates the page, perhaps by adding some session-specific string to the end of the names.
除了 之外autocomplete=off，您还可以通过生成页面的代码随机化您的表单字段名称，可能是通过在名称末尾添加一些特定于会话的字符串。
When the form is submitted, you can strip that part off before processing them on the server side. This would prevent the web browser from finding context for your field and also might help prevent XSRF attacks because an attacker wouldn't be able to guess the field names for a form submission.
提交表单后，您可以在服务器端处理它们之前剥离该部分。这将阻止 Web 浏览器为您的字段查找上下文，还可能有助于防止 XSRF 攻击，因为攻击者无法猜测表单提交的字段名称。
回答by apinstein
Most of the major browsers and password managers (correctly, IMHO) now ignore autocomplete=off.
大多数主要浏览器和密码管理器（正确的是，恕我直言）现在忽略autocomplete=off.
Why? Many banks and other "high security" websites added autocomplete=offto their login pages "for security purposes" but this actually decreases security since it causes people to change the passwords on these high-security sites to be easy to remember (and thus crack) since autocomplete was broken.
为什么？许多银行和其他“高安全性”网站autocomplete=off“出于安全目的”添加到他们的登录页面，但这实际上降低了安全性，因为它会导致人们在自动完成后更改这些高安全性网站上的密码以便于记住（从而破解）坏了。
Long ago most password managers started ignoring autocomplete=off, and now the browsers are starting to do the same for username/password inputs only.
很久以前，大多数密码管理器开始忽略autocomplete=off，现在浏览器开始只对用户名/密码输入做同样的事情。
Unfortunately, bugs in the autocomplete implementations insert username and/or password info into inappropriate form fields, causing form validation errors, or worse yet, accidentally inserting usernames into fields that were intentionally left blank by the user.
不幸的是，自动完成实现中的错误将用户名和/或密码信息插入到不适当的表单字段中，导致表单验证错误，或者更糟糕的是，不小心将用户名插入到用户故意留空的字段中。
What's a web developer to do?
Web 开发人员应该做什么？
- If you can keep all password fields on a page by themselves, that's a great start as it seems that the presence of a password field is the main trigger for user/pass autocomplete to kick in. Otherwise, read the tips below.
- Safarinotices that there are 2 password fields and disables autocomplete in this case, assuming it must be a change password form, not a login form. So just be sure to use 2 password fields (new and confirm new) for any forms where you allow
Chrome34, unfortunately, will try to autofill fields with user/pass whenever it sees a password field. This is quite a bad bug that hopefully, they will change the Safari behavior. However, adding this to the top of your form seems to disable the password autofill:
<input type="text" style="display:none"> <input type="password" style="display:none">
- 如果您可以自己将所有密码字段保留在页面上，这是一个很好的开始，因为密码字段的存在似乎是启动用户/密码自动完成功能的主要触发器。否则，请阅读以下提示。
- Safari注意到有 2 个密码字段并在这种情况下禁用自动完成，假设它必须是更改密码表单，而不是登录表单。因此，请确保在您允许的任何表单中使用 2 个密码字段（新的和确认新的）
不幸的是，Chrome34 会在看到密码字段时尝试使用 user/pass 自动填充字段。这是一个非常糟糕的错误，希望他们能改变 Safari 的行为。但是，将此添加到表单顶部似乎会禁用密码自动填充：
<input type="text" style="display:none"> <input type="password" style="display:none">
I haven't yet investigated IE or Firefox thoroughly but will be happy to update the answer if others have info in the comments.
我还没有彻底调查 IE 或 Firefox，但如果其他人在评论中有信息，我很乐意更新答案。
回答by dsuess
Sometimes even autocomplete=offwould not prevent to fillin credentials into wrong fields, but not user or nickname field.
有时甚至 autocomplete=off也不会阻止将凭据填写到错误的字段中，但不会阻止用户或昵称字段。
This workaround is in addition to apinstein's post about browser behavior.
此解决方法是 apinstein 关于浏览器行为的帖子的补充。
fix browser autofill in read-only and set writable on focus (click and tab)
以只读方式修复浏览器自动填充并将焦点设置为可写（单击和选项卡）
<input type="password" readonly
onfocus="this.removeAttribute('readonly');"/>
Update: Mobile Safari sets cursor in the field, but does not show virtual keyboard. New Fix works like before but handles virtual keyboard:
更新：Mobile Safari 在字段中设置光标，但不显示虚拟键盘。New Fix 像以前一样工作，但处理虚拟键盘：
<input id="email" readonly type="email" onfocus="if (this.hasAttribute('readonly')) {
this.removeAttribute('readonly');
// fix for mobile safari to show virtual keyboard
this.blur(); this.focus(); }" />
Live Demo https://jsfiddle.net/danielsuess/n0scguv6/
现场演示https://jsfiddle.net/danielsuess/n0scguv6/
// UpdateEnd
// 更新结束
Because Browser auto fills credentials to wrong text field!?
因为浏览器自动将凭据填充到错误的文本字段！？
I notice this strange behavior on Chrome and Safari, when there are password fields in the same form.I guess, the browser looks for a password field to insert your saved credentials. Then it auto fills (just guessing due to observation) the nearest textlike-input field, that appears prior the password field in DOM. As the browser is the last instance and you can not control it,
我在 Chrome 和 Safari 上注意到了这种奇怪的行为，当有相同形式的密码字段时。我猜，浏览器会查找密码字段来插入您保存的凭据。然后它会自动填充（只是由于观察而猜测）最近的类似文本的输入字段，该字段出现在 DOM 中的密码字段之前。由于浏览器是最后一个实例，您无法控制它，
This readonly-fix above worked for me.
上面的这个只读修复对我有用。
回答by brendan
<form name="form1" id="form1" method="post"
autocomplete="off" action="http://www.example.com/form.cgi">
This will work in Internet Explorer and Mozilla FireFox, the downside is that it is not XHTML standard.
这将适用于 Internet Explorer 和 Mozilla FireFox，缺点是它不是 XHTML 标准。
回答by Geynen
The solution for Chrome is to add autocomplete="new-password"to the input type password. Please check the Example below.
Chrome 的解决方案是autocomplete="new-password"在输入类型中添加密码。请检查下面的示例。
Example:
例子：
<form name="myForm"" method="post">
<input name="user" type="text" />
<input name="pass" type="password" autocomplete="new-password" />
<input type="submit">
</form>
Chrome always autocomplete the data if it finds a box of type password, just enough to indicate for that box autocomplete = "new-password".
如果 Chrome 找到一个类型为 password的框，它总是自动完成数据，足以指示该框autocomplete = "new-password"。
This works well for me.
这对我很有效。
Note: make sure with F12that your changes take effect, many times browsers save the page in cache, this gave me a bad impression that it did not work, but the browser did not actually bring the changes.
注意：确保F12您的更改生效，浏览器多次将页面保存在缓存中，这给我一个不好的印象，它不起作用，但浏览器实际上并没有带来更改。
回答by Sam Hasler
As others have said, the answer is autocomplete="off"
正如其他人所说，答案是 autocomplete="off"
However, I think it's worth stating whyit's a good idea to use this in certain cases as some answers to this and duplicatequestions have suggested it's better not to turn it off.
但是，我认为值得说明为什么在某些情况下使用它是个好主意，因为对此和重复问题的一些答案表明最好不要将其关闭。
Stopping browsers storing credit card numbers shouldn't be left to users. Too many users won't even realize it's a problem.
停止浏览器存储信用卡号码不应该留给用户。太多的用户甚至不会意识到这是一个问题。
It's particularly important to turn it off on fields for credit card security codes. As this pagestates:
在信用卡安全代码字段中将其关闭尤其重要。正如此页面所述：
"Never store the security code ... its value depends on the presumption that the only way to supply it is to read it from the physical credit card, proving that the person supplying it actually holds the card."
“永远不要存储安全代码......它的价值取决于提供它的唯一方法是从实体信用卡中读取它的假设，证明提供它的人实际上持有该卡。”
The problem is, if it's a public computer (cyber cafe, library etc) it's then easy for other users to steal your card details, and even on your own machine a malicious website could steal autocomplete data.
问题是，如果是公共计算机（网吧、图书馆等），其他用户很容易窃取您的卡详细信息，甚至在您自己的计算机上，恶意网站也可能窃取自动完成数据。
回答by step
I've solved the endless fight with Google Chrome with the use of random characters. When you always render autocomplete with random string, it will never remember anything.
我使用随机字符解决了与谷歌浏览器的无休止的斗争。当你总是用随机字符串渲染自动完成时，它永远不会记住任何东西。
<input name="name" type="text" autocomplete="rutjfkde">
Hope that it will help to other people.
希望它会帮助其他人。
回答by Securatek
I'd have to beg to differ with those answers that say to avoid disabling auto-complete.
我不得不乞求与那些说避免禁用自动完成的答案不同。
The first thing to bring up is that auto-complete not being explicitly disabled on login form fields is a PCI-DSS fail. In addition, if a users' local machine is compromised then any autocomplete data can be trivially obtained by an attacker due to it being stored in the clear.
首先要提到的是，未在登录表单字段上明确禁用自动完成是 PCI-DSS 失败。此外，如果用户的本地机器受到威胁，那么攻击者可以轻松获取任何自动完成数据，因为它是以明文形式存储的。
There is certainly an argument for usability, however there's a very fine balance when it comes to which form fields should have autocomplete disabled and which should not.
可用性当然是有争议的，但是在哪些表单字段应该禁用自动完成功能和哪些不应该禁用时，有一个非常好的平衡。
回答by yajay
Three options: First:
三个选项：第一个：
<input type='text' autocomplete='off' />
Second:
第二：
<form action='' autocomplete='off'>
Third (javascript code):
第三（javascript代码）：
$('input').attr('autocomplete', 'off');
