safari - 从输入中删除 Safari 联系人下拉列表

Question

在输入字段中输入时，safari 会创建一个基于下拉列表的联系人。我不知道如何隐藏这个下拉菜单。我可以隐藏联系人按钮。

我正在运行 Safari 版本 11.0.1

重现 fiddle :

https://jsfiddle.net/27n5jL40/1/

<input type="text" name="fname"><br>

隐藏自动填充按钮

input::-webkit-contacts-auto-fill-button {
  visibility: hidden;
  display: none !important;
  pointer-events: none;
  position: absolute;
  right: 0;
}

Answer 1

好吧，我意识到这个答案可能有点晚了，但我想我可以提供帮助。根据经验，我发现 Safari 从 a) 字段名称、b) 关联标签或 c) 相邻文本中获得提示。它会计算字段名称“姓名”、“名字”、“姓氏”以及标签或相邻文本(如“姓名”、“名字”、“姓氏”)之类的内容。

在我的应用程序中，它与自定义自动填充竞争。我按如下方式击败了我的下拉菜单:

我将字段名称从 xx_firstname 更改为 mxyzptlk，并将标签从 First Name 更改为 F‌irst N‌ame 。 ‌ 字符是零宽度非连接符。你在屏幕上看不到它，但它似乎打败了 Safari - 至少现在是这样!

希望我能找到一些聪明的 css，但这是我能想到的最好的了。