禁用Edge浏览器中的文本输入建议?

26

我已经构建了一个文本框下拉 AngularJS 组件,它在 Chrome、Firefox、Safari 和 Internet Explorer 中表现良好。

该组件的一个功能是您可以输入字符串,然后使用上/下箭头键浏览建议。

在 Microsoft Edge 中,只要按下向下箭头,以下文本就会添加到输入框中:

简要解释您的更改(修正拼写错误,修复语法,改进格式)

是否有任何客户端解决此问题的方法?

<form>
    <input type="text" />    
</form>

为了演示这一点,请运行上面的代码片段,将内容输入到文本框中,然后在Edge浏览器中连续按两次下箭头。我不希望这种情况发生,因为它会破坏我的自动完成功能!
谢谢

你正在使用输入吗?如果没有,你正在使用什么类型的元素?你是想尽一切办法解决这个问题还是采用Angular.js的解决方案? - rockmandew
一个标准的文本输入框,用于构建组件,如果您愿意,可以发布一些代码吗? - JMK
说实话,我不确定“bog”标准文本输入是什么。我猜那是一个笔误,你只是在谈论普通的文本输入。请发布代码,我会跟进的。我假设这是一个简单的“自动完成”设置解决方案。 - rockmandew
抱歉,这是爱尔兰的俚语,我发了一个例子。 - JMK
这完全不是问题,我只是想澄清一下,以确保我给您提供准确的信息。那个解决方案有效吗?如果有效的话,能否请您接受答案,以便关闭该主题? - rockmandew
使用建议答案 https://dev59.com/i1wY5IYBdhLWcg3wTGJu#73691203 中提到的 aria-autocomplete 属性会为我禁用自动完成功能。 - Benjamin Wolff
13个回答

32

如果我理解正确,您在使用自动完成功能时遇到了问题。只需在输入框中添加 "autocomplete='off'" 即可禁用该功能。

<input type="text" autocomplete="off"/>

这在任何现代浏览器上都不起作用。尝试使用诱饵字段。https://dev59.com/pXVD5IYBdhLWcg3wRpeX#2555771 - Michael Kuhinica
在Edge中,如果您使用退格键并删除输入内容,则Edge将显示自动完成框。因此,尽管此属性有所帮助,但它并不能解决问题。 - Brain2000
9
我刚发现微软禁用了“autocomplete=off”属性。这是一个可怕的决定。https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/9847360/ - Brain2000
@Brain2000 - 这是针对所有微软浏览器还是只针对Edge以下的浏览器? - rockmandew
1
@rockmandew 只是 Edge。IE 11 仍然可以使用。我发现在 Edge 上抑制器在某种程度上有效,因为如果您通过 Tab 键进入输入框并按退格键删除内容,则自动完成仍然会出现。 - Brain2000
@Brain2000 Chrome也会忽略autocomplete=off。https://dev59.com/Imct5IYBdhLWcg3wEJcm - Mike

27

不幸的是,以上的建议在最新版的Edge中对我都没有用。然而这个解决方案有效:

很抱歉,上述建议对我在最新版本的Edge浏览器中无效。不过,下面这个解决方案可以解决问题:

<input type="text" autocomplete="off" list="autocompleteOff" 
    id="fieldId" name="fieldname" placeholder="Placeholder here" />

这会强制 Edge 查找名为 autocompleteOff 的数据查找列表,但该列表并不存在。对我来说效果很好。

额外的好处是它是纯 HTML,不需要 CSS 或 JS。

2021 年更新:

另一个对我非常有效的解决方案是向字段添加 readonly 属性,然后在短暂延迟几毫秒后使用 JQuery 删除标记。 readonly 属性会导致 Edge(和其他浏览器)忽略该字段。


3
这是最佳答案。 - user749798
Edge Chromium 上,使用 list="autocompleteOff",因为 autocomplete="off" 是无效的。 - Vifier Lockla
7
Edge Chromium,很遗憾我发现它无法正常工作。 - Garr Godfrey
1
我正在使用 Microsoft Edge 版本 102.0.1245.33(官方版本)(64 位),但这个解决方案不起作用。 日期:2022 年 6 月 10 日 - Biswas Khayargoli

26

如果有人在Edge 105+上遇到自动填充忽略autocomplete="off"的情况,你可以使用aria-autocomplete="none"来防止自动填充显示(经macOS 12.5测试可行,但在其他平台上也应该有效)


这在我的Edge版本105.0.1343.42上有效,你是怎么知道的? - ravin.wang
1
我读了几篇关于自动完成和自动填充的博客文章/Chrome问题,有人提到了aria-autocomplete属性,我阅读了文档并进行了测试。果然,当处理自动填充时,Edge不会忽略这种属性。 - Miguel Sánchez Villafán
3
在运行Edge版本105.0.1343.42的Windows 10上,添加aria-autocomplete解决了我的问题。这个答案可能应该被提升为被接受的解决方案。 - Benjamin Wolff
2
我曾经因为所有的旧解决方案都不起作用了,而且我找到的其他建议也没有用而感到疯狂。在Windows 10、Edge版本106.0.1370.37中,aria-autocomplete对我很有用。 - Erin Halbmaier
1
在Edge浏览器版本114.0.1823.67(官方版本)(64位)和Windows 11上完美运行。 - gregoryp
显示剩余2条评论

8
从Mozilla的文献中: 您可以在实际表单标签<form autocomplete='off' ... >...</form>上设置自动完成,这将适用于整个表单,或者在单个<input type='text' />标签上。在我的IE 11和Edge体验中,将其放在表单上可以工作,但单个标签不起作用。我尝试在Chrome上进行测试,但字段已经不会自动完成了。有关详细信息,请阅读完整的文章。 注意: 大多数浏览器忽略此功能登录字段。

1
在 Edge 中,它只在表单上工作,而不是在单个元素上,谢谢。 - Michael Goltsman

4
如果您想在Chrome中输入时取消自动完成功能,可以使用autocomplete="off"。但是,您也必须删除id,否则如果您不删除id,自动完成将无法起作用!
简单的例子:
<input type="text" autocomplete="off" list="autocompleteOff" 
     name="fieldname" placeholder="Placeholder here" />

你可以使用名称处理输入,这对我来说很有效。

3
<input type="text" autocomplete="new-password" />

如果您正在定义一个用户管理页面,用户可以在此页面上为其他人指定新密码,因此您想要防止密码字段的自动填充,您可以使用autocomplete =“new-password”。它也适用于非密码字段。 MDN参考

2
如果您需要在应用程序/网站范围内使用它,可以使用jQuery:
$('input').attr('autocomplete','off');

如果您像我一样使用Angular+ui-router,您可以尝试以下方法:
在您的index.html中添加以下脚本:
<script type="text/javascript">
    setTimeout(function() {
        $('input').attr('autocomplete', 'off');
    }, 2000);
</script>

为了覆盖状态变化,将以下内容添加到您的根控制器中:

$rootScope.$on('$stateChangeStart', function() {
                $timeout(function () {
                    $('input').attr('autocomplete', 'off');
                }, 2000);
            });

超时时间是为了在应用jquery之前渲染html。
如果您发现更好的解决方案,请告诉我。

如果渲染有时需要花费2001毫秒来完成呢? - jinglesthula

2

它只在同一台计算机上遇到相同的“somerandomstring”时才起作用。也许如果您使用当前时间戳作为自动完成... - Garr Godfrey

1

自昨天起(edge 105.0.1343.25),autocomplete="off"已经无法使用。我认为这是一个bug,希望他们能尽快修复。


1
在你的输入框中加入autocomplete="off" list="autocompleteOff",然后就完成了!

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接