表单自动填充问题解决

最新推荐文章于 2024-04-26 16:06:24 发布
VIP文章 最新推荐文章于 2024-04-26 16:06:24 发布
阅读量765 收藏
点赞数
分类专栏： 前端问题总结 文章标签： 前端 javascript html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u013994400/article/details/126409207
版权

Html登录表单经常被自动填充，有的甚至用户从来没有登录过的网站也会有自动填充，甚是让人讨厌。

Mozilla 官方文档建议

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

1 <input type="text" name="foo" autocomplete="off" />
但是这种方案不兼容某些Chrome、Firefox 。

兼容所有浏览器

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

<input style="display:none"><!-- for disable autocomplete on chrome -->
<input
最低0.47元/天 解锁文章
guhy fighting
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
chrome表单自动填充导致input文本框背景变成偏黄色问题解决
09-25
chrome表单自动填充后，input文本框的背景会变成偏黄色的，想必大家都会碰到这种情况吧，这是由于chrome会默认给自动填充的input表单加上input:-webkit-autofill私有属性造成的，解决方法如下，感兴趣的朋友可以了解下
解决elementUI 表单输入框浏览器自动填写问题
Mitchell1696的博客
04-18 1720
一般来说，输入表单、提交之后，浏览器会保存表单内容，刷新页面之后对应表单内容会自动填充。这个机制可以说是有利有弊，好的是如果经常登录同一个平台，自动填充账号密码显然可以提高效率；但如果是在注册这种场景下，每一次输入表单的内容都不相同，自动填充功能会严重影响我们的使用体验。
如何禁止(表单)用户名、密码自动填充
zhengun的专栏
04-16 656
Html登录表单经常被自动填充，有的甚至用户从来没有登录过的网站也会有自动填充，甚是让人讨厌。 Mozilla developer documentation 建议使用表单设置属性 tautocomplete=”off” 来阻止浏览器从cache获取数据填充登录表单。 &lt;input type="text" name="foo" autocomplete="off" /&gt; 但是这...
Python+Selenium实现表单自动填充和提交
软件自动化测试技术交流、资源分享
01-03 734
首选我们要了解Selenium 是一个强大的自动化测试工具，它可以让用户在浏览器中进行操作模拟。而 Python 是一种简洁而强大的编程语言，它可以让我们轻松编写自动化脚本。结合这两者，我们可以实现自动填充和提交表单的目标。
前端如何解决浏览器自动填充input输入框账号密码的问题
migexiaoliang的博客
04-14 1万+
问题描述 【登录】子用户登录页面自动填充位置错误，本来主账号的账号密码，等切换到子账号登录页的时候，自动填充到了子账号的位置。 解决方案 <input auto-complete="new-password" autocomplete="new-password" v-model="childUserName" placeholder="IAM用户名" @focus="clearErrorInfo('childUserName')
浏览器表单自动填充调研
mjzhang1993的博客
04-10 1158
自动填充保存用于登录此网站的密码，这个动作是需要用户手动确认的，如果用户没有保存则不会有，网站的这个功能主要是为了存储密码，如果是个普通表单，那么不会被浏览器记录（chrome 对设置了 name 的表单会有记录）自动填充分两种，一种是直接添加到表单中（非交互自动填充），一种是提供下拉选择（交互自动填充）firefox 中如果一个域名下只有一个账号密码记录，那么会自动添加到表单中chrome（非无痕模式） 中一个域名下无论有多少个账号密码记录，都会自动添加最近使用的到表单中。
浏览器输入框或表单关闭自动填充autocomplete=off
热门推荐
wzp20092009的博客
09-16 1万+
浏览器端有时候会记录用户输入信息作为缓存，下次输入框focus时将会有下拉缓存供用户选择填充，如果缓存次数过多会影响其页面正常显示。autocomplete=off
html 表单自动填充,自动填充Web表单的方法与流程
weixin_39976951的博客
05-30 1888
本发明涉及表单填充技术领域，特别涉及一种基于AJAX框架和HTML自定义属性自动填充Web表单的方法。背景技术：HTML是用来描述网页的一种语言，是一种超文本标记语言(Hyper Text Markup Language)，HTML使用标记标签来描述网页，HTML标记标签通常称为HTML标签(HTML tag)，如尖括号包围的关键字，等，HTML标签具体呈现的内容以及样式是根据标签中的属性进行展示...
浏览器自动填充前端项目用户名和密码bug
2301_76431401的博客
08-14 164
在密码el-input 加上show-password autocomplete="new-password"即可。
浏览器自动填充表单导致网页样式丢失原因分析及解决
09-22
是由于我之前在本机上测试的时候在浏览器保存了这个登陆页面的用户名密码，在打开这个页面的时候chrome自动填充用户名密码，同时用webkit默认样式替代网页样式，把chrome保存的这个网页的用户名密码清掉就可以了
解决浏览器会自动填充密码的问题
12-11
form表单的属性如下所示： 但是这个解决方案在谷歌和火狐上均有bug,下面来一个一个解决。 1.’autocomplete=”off”‘在Chrome中不起作用解决方案 网站项目中，有登录和注册的弹框，在除chrome的浏览器中一切都ok，...
disableautofill.js:禁用表单自动填充和自动完成功能
05-09
disableautofill.js 禁用Google Chrome自动填充和自动完成功能的最简单解决方案。 该库执行以下步骤： 将type="password"替换为type="text" 。 [1] 用星号符号代替密码文本。 在表单上添加属性autocomplete="off" 。...
【前端】数组的常用处理函数
lcukyNwa的博客
04-22 401
item------->每个元素值 (必)index----->索引（可选）arr-------- >当前数组（可选）推荐vscode的一款插件来写以下的demo，该插件可以直接在js文件中显示结果，搜 Quokka.js用这个插件去新建一个js文件，直接就运行在node上了forEach不会返回一个新的数组，里面改值会影响原数组，其他方法不影响原数组map可以返回新数组 用于映射，如每个元素都加倍或执行其他转换操作every返回一布尔值，需数组中全部满足。
C++ WebServer的细节理解
我的博客
04-22 594
在非阻塞模式下，如果 I/O 操作不能立即完成（例如，因为没有数据可读 或 写缓冲区满），系统不会让调用进程阻塞等待，而是立即返回一个错误（通常为 EAGAIN 或 EWOULDBLOCK）。先查询文件描述符 fd 当前的标志，然后将 O_NONBLOCK 标志加入其中，并通过 F_SETFL 来更新文件描述符，最终实现将该文件描述符切换为非阻塞模式。这意味着，如果没有待处理的连接请求（即没有客户端尝试连接到服务器），accept() 会一直阻塞，直到有新的连接请求到达或发生其他特定条件（如超时）为止。
SpringBoot项目打包分离高阶操作
Record Little
04-23 586
虽然传输jar包 比较大，但是安全性、稳定性比较高，不需要关注pom.xml 添加了新的依赖、更新了版本号等等影响版本功能的操作。关注maven的特性， profiles即可满足， 根据不同的activation 状态，激活不同的build操作。每次修改一小部分代码或仅仅更新某个依赖jar包时，都需要重新进行整个项目的构建、打包、上传和部署。但是当你的项目趋于稳定，只有业务上的逻辑变更时，如果使用分离版本，可以加快迭代、更新的速度。弊端： 需要配置IDE命令，修改依赖时需要同时修改2处。
webman 事务回滚失效问题记录
juan9872的博客
04-21 746
webman是一款基于workerman开发的高性能HTTP服务框架。webman用于替代传统的php-fpm架构，提供超高性能可扩展的HTTP服务。你可以用webman开发网站，也可以开发HTTP接口或者微服务。除此之外，webman还支持自定义进程，可以做workerman能做的任何事情，例如websocket服务、物联网、游戏、TCP服务、UDP服务、unix socket服务等等。
vue实现录音并转文字功能，包括PC端web，手机端web
最新发布
byebukesi的博客
04-26 352
不止vue，不限技术栈，vue2、vue3、react、.net以及原生js均可实现。
web server apache tomcat11-17-default-servlet
04-23 822
整理这个官方翻译的系列，原因是网上大部分的 tomcat 版本比较旧，此版本为 v11 最新的版本。您可以使用或，DefaultServlet 将创建一个 XML 文档，并根据 XSLT 文件中提供的值运行它进行 XSL 转换。首先检查，然后是，最后是。如果没有配置 XSLT 文件，则使用默认行为。
html如何避免360自动填充账号密码,解决浏览器会自动填充密码的问题
05-31
可以通过以下两种方式来避免浏览器自动填充账号密码： 1. 在表单中添加 autocomplete 属性，将其设置为 off。 例如： ``` <form action="/login" method="post" autocomplete="off"> <label for="username">用户名：</label> <input type="text" id="username" name="username"><br><br> <label for="password">密码：</label> <input type="password" id="password" name="password"><br><br> <input type="submit" value="提交"> </form> ``` 2. 通过 JavaScript 来禁用自动填充。 例如： ``` <input type="text" id="username" name="username" onfocus="this.removeAttribute('readonly');" readonly> <input type="password" id="password" name="password" onfocus="this.removeAttribute('readonly');" readonly> <script> // 禁用自动填充 function disableAutoFill() { var elements = document.getElementsByTagName('input'); for (var i = 0; i < elements.length; i++) { if (elements[i].type === 'password' || elements[i].type === 'text') { elements[i].setAttribute('autocomplete', 'off'); elements[i].setAttribute('readonly', 'true'); elements[i].onfocus = function() { this.removeAttribute('readonly'); } } } } disableAutoFill(); </script> ``` 这样做可以确保浏览器不会自动填充账号密码。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值