禁用 Firefox 自动填充 html 表单但保持自动完成

Posted 2023-02-24

【中文标题】禁用 Firefox 自动填充 html 表单但保持自动完成

【英文标题】：Disable Firefox autofilling html forms but keep auto complete

【发布时间】：2011-02-01 15:16:35

【问题描述】：

较新版本的 Firefox 有一个新的“功能”，它可以记住表单中填写的内容，并在刷新时使用这些值重新填充表单（也许在其他情况下也是如此？）。

问题是我们有一个相当复杂的 Web 应用程序，它使用了相当多的 ajax 和隐藏的表单字段，这些字段永远不会由用户填写，而是由 javascript 填写。 由于这个新的“功能”，我们​​在刷新表单时会遇到很多错误，因为这些字段突然填充了无效值。

所以我正在寻找一种在不禁用自动完成的情况下关闭此“功能”的方法。 （因为这对我们的客户填写的字段很有用）

如果我放了

autocomplete='off'

在我的 html 中，该效果被禁用，但这会失去自动完成功能（显然）。 问题在于在没有任何用户操作的情况下刷新后填写的字段。

【参考方案1】：

虽然密码管理器会在完全匹配的情况下填充用户名和密码，但自动完成本身不会自动填充字段。但我猜你正在考虑你得到的那种刷新，比如说，如果你重新加载页面。在这种情况下，字段值由会话历史记录恢复，但您可以通过将页面标记为不可缓存来关闭它。

【参考方案2】：

在你开始你的其他 javascript/ajax 任务之前，你应该使用 javascript 将这些字段的值设置为空或任何默认值。

【参考方案3】：

这是一项浏览器功能 - 如果不进入每个客户端浏览器的设置，您就无法禁用它。

我建议更强大的验证 - 客户端和服务器端。

【参考方案4】：

页面加载后，但在你做任何其他逻辑之前，你应该强制该值为空：

inputElem.value = '';

【参考方案5】：

这是我整理的一个 jQuery 解决方案。

它不会禁用自动填充，而是在浏览器完成它之后覆盖字段。

我在制作这个时试图与 Chrome 的自动填充作斗争。单独使用 .val('') 是行不通的，因为它在 chrome 自动填充功能启动之前触发。

var noFiller = $('input[type="text"]');

noFiller.val(' ');
var t=setTimeout(function()
    noFiller.val('');
,60);//keep increasing this number until it works

【参考方案6】：

已经提到了 Javascript 解决方案（通过 Ajax 加载或更新页面时将字段值设置为空）。

另一种选择可能是生成带有随机数的字段 ID，这样浏览器就无法将它们与缓存值匹配，但这可能会搞砸其他事情。

【参考方案7】：

自动完成并不是什么新鲜事。每个浏览器都有它。看到这个http://www.w3.org/Submission/web-forms2/#the-autocomplete

自动填充？你确定吗？使用 Firebug（Firefox 插件）检查您输入的值属性。检查您在 ajax 中的发布和响应。也许您的 ajax 正在幕后填充它。

顺便说一句：请记住禁用任何外部工具栏。有一些用于 Firefox/IE/Chrome/etc 的工具栏可以为用户自动填充数据。警告。

【讨论】：

问题不是自动完成的。但是表单会记住值（其中选择框在刷新页面之前已经被选中，即使另一个选项被标记为“SELECTED”