分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 代码编程

html input组织自动补全

发布时间:2023-09-06 02:06责任编辑:熊小新关键词:暂无标签

Mozilla 官方文档建议

Mozilla developer documentation 建议使用表单设置属性 tautocomplete=”off” 来阻止浏览器从cache获取数据填充登录表单。

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

但是这种方案不兼容某些Chrome、Firefox。

兼容所有浏览器

最终决定使用使用隐藏input来接受浏览器自动填充,这样不会影响用户体验,也可以兼容所有浏览器。

 ?<input style="display:none"><!-- for disable autocomplete on chrome --> ?<input type="text" id="username" ?name="username" ?autocomplete="off">

但是实际上在Chrome上并没什么用,在FireFox上也只能阻止用户名自动填充。

接着搜索,又发现了个新东西

<input type="password" ?autocomplete="new-password">

把password的autocomplete属性由off变成了new-password,发现Chrome不自动填充了,但是FireFox上仍然会填充用户名

再接着结合第一点尝试,最后结果是使用以下方式

 <input type="password" style="display: none;"/> <input type="text" autocomplete="off"/> <input class="form-control" type="password" name="tradePassword" id="txPassword" autocomplete="new-password"

这样在Chrome和FireFox上就都不会填充了。

html input组织自动补全

原文地址:https://www.cnblogs.com/cacasala/p/9376965.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved