:autofill 和 autocomplete 自动填充简介

379 阅读1分钟

①Chrome 浏览器在用户使用了自动填充功能的情况下,autocomplete="off" 无效;
②Safari 浏览器在 username,email 和 password 文本框的时候,关闭自动填充无效;
③Firefox 浏览器则是在登录表单中无法使用 autocomplete="off" 关闭自动提示;
④autocomplete off 无效要分两种情况:一种是阻止非交互自动填充,一种是阻止交互式自动填充;
⑤所谓非交互自动填充,指的是无需用户操作,一进入页面,浏览器就帮你把对应的数据填充好了;
⑥阻止方案:在用户名和密码的输入框前面插入两个隐藏的输入框;
⑦阻止交互式自动填充:要么使用 autocomplete="off",要么使用 autocomplete="new-password";
⑧autocomplete 支持的属性值有:on、off、username、new-password、current-password、email 等;
⑨想要让自动填充的高亮背景色不显示,需要使用其他方法,目前业界用的比较多的就是使用巨大的 box-shadow 内阴影进行覆盖;
(参考:www.zhangxinxu.com/wordpress/2…