如何阻止 Safari 使用错误的电子邮件自动填充电子邮件字段?

Posted

技术标签:

【中文标题】如何阻止 Safari 使用错误的电子邮件自动填充电子邮件字段?【英文标题】:How can I stop Safari autofilling the email field with the wrong email? 【发布时间】:2018-07-26 00:33:56 【问题描述】:

我们的联系人管理软件使用户能够将他们朋友的联系方式添加到他们的帐户中。

您可以添加的详细信息之一是“电子邮件地址”。但是由于某种原因,在 Safari 上,电子邮件地址字段会自动填充用户自己用于登录的电子邮件地址。如果您关闭“首选项”下的“自动填充”选项,则不会发生这种情况,但这显然不可行我们所有用户的解决方案。

我已尝试添加 autocomplete="off",但 Safari 似乎忽略了这一点。

这是两个字段:

登录字段:

<input type="email" class="input-block-level" placeholder="Email address" name="email" id="user_email">

内部字段:

 <input type="text" id="pri_email" autocomplete="off" name="pri_email">

我无法理解的是为什么 Safari 甚至认为它们是同一个东西。它们有不同的 ID 和名称。

我怎样才能阻止这种情况发生?最好不要像suggested here 这样的变通办法。

【问题讨论】:

当您已经在 html 代码中为输入字段提供了值 (value="test@test.com") ...? @CBroe。对不起 - 错字。我会解决的。 您确定您的浏览器中没有安装其他东西(如扩展程序)来自动完成表单字段吗?对我来说,普通的 safari 自动完成功能与 chromes 相同,它为我提供了一个下拉选项。这听起来更像是您有一个使用 javascript field.value = "some value"; 从扩展程序触发的脚本,特别是如果在 HTML 上设置了 value="" this answer 不起作用吗? @Urbycoz 适用于每个属性:id、name...甚至占位符。 【参考方案1】:

你可以使用

<input type="email" class="input-block-level" placeholder="Email address" name="email" id="user_email" value="">

原因是 Safari 忽略了自动完成功能。如果 Safari 的版本是 5.2 或更高版本,它将接受它。 w3schools.com上提到过

【讨论】:

我正在使用 Safari v11.0.3 但我仍然可以使用它。 所以,你可以使用value属性。 即使我包含 value 属性,它仍然会自动填充。 我对 safari 了解不多。 safari 是否适用于 windows 8。如果是,我会下载它然后我会搜索答案。 我不这么认为。还是谢谢。【参考方案2】:

在表单标签中设置AUTOCOMPLETE = off

<FORM METHOD="POST" ACTION="" AUTOCOMPLETE="off">

选中此项 - 将 text 的类型更改为 email

 <input type="email" id="pri_email" autocomplete="off" name="pri_email">

【讨论】:

【参考方案3】:

在标签表单中使用 autocomplete=”off”

如果不起作用,那是因为 autocomplete=”off” 不是 XHTML 过渡的有效标记,这是常见的 DOC 类型。使用它来保持有效的标记试试这个。

if (document.getElementsByTagName) 

var inputElements = document.getElementsByTagName(“input”);

for (i=0; inputElements[i]; i++) 

if (inputElements[i].className && (inputElements[i].className.indexOf(“disableAutoComplete”) != -1)) 

inputElements[i].setAttribute(“autocomplete”,”off”);






【讨论】:

【参考方案4】:

显然,关闭/开启状态仍未在所有浏览器中正确实现。 但是,对于大多数浏览器来说,“无效”值似乎会产生“关闭”的预期效果。

试试这个:

<input type="text" id="pri_email" autocomplete="nope" name="pri_email">

【讨论】:

【参考方案5】:

它适用于虚假输入:

<input autocomplete="off" type="text"  name="email">
<input type="text" name="fake_email" id="fake_email" style="height: 0px; width: 0px; overflow: hidden;" tab-index="-1" aria-hidden="true">

autofill single field email in Safari (ios) does not working

【讨论】:

【参考方案6】:

幸运的是,有一个“简单”的解决方案。

在名称属性中插入带有“搜索”一词的文本将阻止 Safari 显示自动填充图标和键盘选项。这是因为 Safari 执行一个正则表达式并将“搜索”映射到不需要自动填充的输入。

<input name=”notASearchField” />

来源:https://bytes.grubhub.com/disabling-safari-autofill-for-a-single-line-address-input-b83137b5b1c7

【讨论】:

以上是关于如何阻止 Safari 使用错误的电子邮件自动填充电子邮件字段?的主要内容,如果未能解决你的问题,请参考以下文章

如何在 React 的输入字段中隐藏自动填充 Safari 图标

如何阻止safari从网页直接跳转至app

删除字段时,Chrome 自动填充会重新填充输入

如何让 Safari 自动填充信用卡到期日期月/年选择标签?

如何关闭输入自动完成?

如何在 Apache 中阻止特定的用户代理