解决Chrome浏览器自动填充账号密码的问题

最新推荐文章于 2024-10-15 17:17:43 发布

Jerryman_GHJ

最新推荐文章于 2024-10-15 17:17:43 发布

阅读量4.5k

点赞数

分类专栏： html5 文章标签：自动填充保存密码 autocomplete 浏览器自动填充

本文链接：https://blog.csdn.net/Jerryman_GHJ/article/details/84172560

版权

html5 专栏收录该内容

4 篇文章

订阅专栏

本文介绍了一种防止密码在前端被恶意脚本窃取的方法。通过在密码输入框前添加两个隐藏的输入框，并将密码框的type属性设置为text，结合onfocus事件动态切换为password类型，有效提升了安全性。

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

废话不多说，直接上代码：

<div class="m-regForm__block ">
     <label for="password" class="u-label">设置密码</label>
     <input type="text" style="display: none;">
     <input type="password" style="display: none;">
     <input type="text" id="password" class="u-input" maxlength="16"
            onfocus="this.type='password'" autocomplete="off"
            placeholder="请输入6~16位密码">
</div>

1.在密码框之前，加两个input，如上图。

2.密码框type设置为text，设置onfocus事件，并加上Html5新属性 autocomplete="off"

【type="text" οnfοcus="this.type='password'" autocomplete="off"】