解决输入框记住的(浏览器)密码回填到输入框问题

本文介绍了多种防止浏览器自动填充密码的方法,包括设置`autocomplete`属性、使用隐藏输入框、在`form`标签上设置`autocomplete="off"`以及通过监听输入框的`focus`和`input`事件动态改变`type`属性。此外,作者还分享了一个名为`vue-passinput`的密码输入框插件,但警告该插件可能存在的维护问题。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

一,阻止密码自动回填

1.<input type="text" name="password" οnfοcus="this.type='password'" autocomplete="off"/>

2.autocomplete="new-password"

3.autocomplete="nope"

4.<input style='position:fixed;bottom:-9999px'></input>同级再放一个input,只不过隐藏掉

5.在form表单上添加 autocomplete="off"

以上解决问题的并不是在每种情况下都试用,但是基本都能解决密码框回填的问题了,这就是关于回填的坑

6.<input type="password" readonly οnfοcus="this.removeAttribute('readonly');"/>

二,阻止回填列表显示

当时做的项目,因为这个是支付密码输入框,所以点击输入框虽然不会回填了,但是导致的问题就是输入框获取到焦点的时候会出现这个列表,测试提出来这个Bug了,这个问题相对就难解决点,网上也没有人能够明确说出解决办法,于是乎࿰

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值