input输入框禁止显示历史记录,解决input自动弹出记录_input有没有办法自动弹出数据-CSDN博客

原生

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

elementUI

<el-input auto-complete="new-password"></el-input>

最近看到下个版本此属性要被废弃了，注意一下。

问题
上述代码可能确实有效，但是浏览器保存的历史密码记录依然会显示出来。
解决方案如下：

<input readonly onfocus="this.removeAttribute('readonly');this.type='password';" placeholder="输入密码" v-model="form.password" autocomplete="off" />

需求
另外提一下产品的需求，想要每次打开浏览器进入网页，用户都需要重新输入密码，这样用户就可以记住，而不是咨询客服帮助。
在网上搜索了一下，找到一个方案，就是区分浏览器关闭和刷新，当关闭的时候，清除登录的缓存。
但是有个问题是，当你关闭浏览器标签页的时候，清除缓存是有效的。但是关闭整个浏览器时，清除缓存无效。
原因是因为，这个方案是通过两个事件的时间差来区分关闭和刷新的。我记得值是5ms,刷新的时间差是大于5ms的，关闭tab标签页的时间差是小于5ms的，所以此时有效。
但是当浏览器有多个tab页打开时，浏览器关闭的时间差远远大于5ms。所以无法区分。

解决方案
最终的解决方案就是采用银行的那套方案，当你一段时间不操作后，后端判定登录token失效。外加前端不保存密码，且不显示历史密码记录