当页面上有密码字段但没有电子邮件字段时浏览器凭据自动完成问题

Browser credential autocompletion issue when there is a password field on page without email field

在 laravel jetstream standard user-profile-managing scaffolding 中有一个页面 http://127.0.0.1:8000/user/profile 可以在没有电子邮件字段的情况下找到带有 type="password" 的输入字段。这样做是为了让用户更改密码。

如果有任何其他字段带有 type="text" 或 type="search",它将自动填写为这样的电子邮件:

Wrong looking search field

但是当我添加额外的输入字段 type="email"(当然这个字段可以被隐藏)时,它看起来通常应该是这样的:

Normally looking search field

仅当浏览器“记住”密码时才会出现此问题。

所以问题是可以添加额外的“电子邮件”字段来欺骗浏览器吗?

还有其他更好的方法吗?

更新1:隐藏字段不起作用。只有当它可见时...

更新 2:字段可以是零宽度而不是隐藏。

更新 3:另一个有用的东西 - 将搜索字段包装在表单标签中。

将搜索字段包裹在它自己的表单标签中会有所帮助。

此外,将其他表单的内容包装在自己的表单标签中也会有所帮助。否则,浏览器会认为整个页面是一个单一的表单,并会尝试自动填充。

最好用不同的 IDs/names 将每个表单包装在自己的表单标签中,以帮助浏览器理解它们各不相同且不相关。