在chrome浏览器中,浏览器对于[1]type为password和text的[2]带有name或者id属性的<input>标签会有自动填充表单功能,虽然会给用户记住密码带来一定的便利,但是对于布局会有一定的bug。因此更多时候,开发人员选择取消这一功能。

查询各种资料总结出来的方案有:

1. 添加 autocomplete='off' 属性,不让浏览器自动填充。(验证失效)

2. 添加 autocomplete='new-password' ,参考自网易邮箱登录的处理方式。(验证失效)

3. 添加 readonly='readonly' 或者 disabled='disabled' 属性。(可用,但是填充功能需要监听focus)。

4. 在<input id='ipt' 或者 name='ipt' value='' /> 标签之前写一个同样的标签,<input id='ipt' name='ipt' value='' style='display:none'>,使得自动填充作用于未显示的元素上。(有效)

4. 去掉nameid属性,使用class来作为选择器的替代,不会进行自动填充。(亲测 chrome 69 有效

综上,如果不想要填充功能,去除name和id属性是最简单有效的方法。

google chrome浏览器自动填充解决方案的更多相关文章

  1. input placeholder 在chrome 浏览器自动填充时,背景色覆盖原有背景图片问题。

    user-block-name, .user-block-pwd { margin-bottom: 10%; text-align: center; position: relative; } .us ...

  2. chrome浏览器自动填充失效问题

    现在浏览器带有自动填充,一般在input标签中增加autocomplete="off" 可以进行控制,off代表不填充,on代表填充,这个属性也可以放在form标签中,对所有的in ...

  3. 解决chrome浏览器自动填充密码

    chrome会自动填充密码,解决方法很简单 使用下面的参考代码即可: <input type="password" readonly οnfοcus="this.r ...

  4. Chrome浏览器自动填充<input>标签的密码

    问题:登录页面登录时,Chrome浏览器保存了用户名和密码,在其他页面管理其他的账户和密码时,密码框先是显示正确的密码,然后一闪而过被覆盖. 原因:问了技术主管才得知,Chrome浏览器中的,保存用户 ...

  5. 禁止chrome浏览器自动填充表单的解决方案

    经过测试,对chrome42,重写input: auto-fill样式不起作用,加上autocomplete="off"也不起作用. 因此使用了两个隐藏的输入框: <inpu ...

  6. 详解Google Chrome浏览器(操作篇)(下)

    开篇概述 由于最近忙于公司产品的架构与研发,已经三个多月没有写博客了,收到有些朋友的来信,问为什么不及时更新博客内容呢,他们说他们正期待着某些内容.对此,非常抱歉,那么我在此也给各位朋友一些承诺,从即 ...

  7. 【ASP.NET MVC系列】浅谈Google Chrome浏览器(操作篇)(下)

    ASP.NET MVC系列文章 [01]浅谈Google Chrome浏览器(理论篇) [02]浅谈Google Chrome浏览器(操作篇)(上) [03]浅谈Google Chrome浏览器(操作 ...

  8. 详解Google Chrome浏览器(操作篇)(上)

    开篇概述 在上篇博客中详解Google Chrome浏览器(理论篇)一文中,主要讲解了Chrome 搜索引擎使用.Chrome安装和基本操作.Chrome 基本架构.多线程等原理性问题,这篇将重点讲解 ...

  9. Ubuntu 14.04 LTS下安装Google Chrome浏览器

    在Ubuntu 14.04下安装Google Chrome浏览器非常简单,只要到Chrome的网站下载Deb安装包并进行安装即可.当然你也可以使用APT软件包管理器来安装Google Chrome浏览 ...

随机推荐

  1. sql如何选取两个数据表中的值

    一.直接在要选择的数据前面加上数据表的名字就行了 SELECT po.OrderID, p.LastName, p.FirstName FROM Persons AS p, Product_Order ...

  2. SQl Server 函数篇 聚合函数

    说一下数据库中的聚合函数 函数使用必须加小括号(), 5种聚合函数: 1.max最大值   select max(price) from car where code='c024'   --取这一列中 ...

  3. 面试题:struts 值栈 有用

    一. 核心部分 1. [核心试题]完成当天课堂练习 2. [多选题] 阅读如下代码中,下列哪种方式可以在页面正确迭代获取集合中的数据 (ABC) public String add(){ ValueS ...

  4. MSER

    1.注释很全的分析:http://blog.csdn.net/zhaocj/article/details/40742191 2.opencv采用的mser实现方法 * 1. the gray ima ...

  5. c语言中会遇到的面试题

    预处理器(Preprocessor) 1 . 用预处理指令#define 声明一个常数,用以表明1年中有多少秒(忽略闰年问题)         #define SECONDS_PER_YEAR (60 ...

  6. Charles常见问题汇总

    Charles是一款很好用的抓包修改工具,但是如果你不是很熟悉这个工具的话,肯定会遇到各种感觉很莫名其妙的状况,这里就来帮你一一解答下面再说说charles的一些其他常用的功能. 选择请求后,右键可以 ...

  7. 利用using和try/finally语句来清理资源

    使用非托管资源的类型必须实现IDisposable接口的Dispose()方法来精确的释放系统资源..Net环境的这一规则使得释放资源代码的职责 是类型的使用者,而不是类型或系统.因此,任何时候你在使 ...

  8. Spring中的事务控制

    Spring中事务控制的API介绍 PlatformTransactionManager 此接口是spring的事务管理器,它里面提供了我们常用的操作事务的方法 我们在开发中都是使用它的实现类: 真正 ...

  9. MySQL运维及开发规范

    一.基础规范 (1) 使用INNODB存储引擎 (2) 表字符集使用UTF8 (3) 所有表都需要添加注释 (4) 单表数据量建议控制在5000W以内 (5) 不在数据库中存储图.文件等大数据 (6) ...

  10. VB6加载MSCOMCTL.OCX出现“不能加载''”错误的处理方法汇总

    自从我安装卸载几次OFFICE和WPS后,VB6就出现了这样的问题. 然后在网上收集各种解决办法: 1.第一种:工程文件引用可能有问题,跟本机的相关组件版本不一致. 用记事本打开VBP文件找到这一行: ...