HTML5 中的新属性autocomplete="off"失效的解决方法(兼容firefox,IE,360)
因为业务需求,在写一个注册页面的时候,发现浏览器会自动填充此域名下已经保存的账号密码,给用户带来不便。加了HTML5 中的新属性autocomplete="off" ,但是并没有产生效果。 反复测试后发现浏览器自动填充机制是满足:页面里有一个type=password的input且这个input前面有一个type=text的input。的时候就会进行自动填充。
firefox和360浏览器的处理方式是:只要检测到页面里有满足填充机制的,不管是不是display:none 的,只要检测到就直接往里填充。而且是有几个符合条件的就填充几个。而chrome 54版本略有不同:满足上面的条件且页面里只有一个type=password 的input。才会自动给第一个type=text 的input填充账号,给type=password 的input填充密码。所以chrome 54版本不存在注册页面自动填充的问题。 Google出来的方法是修改input的type , 页面里input都写成type=text , 等获得焦点的时候给改成type=password。下意识去搜了下IE下修改type,发现IE下type是个只读属性,修改type的方法并不能兼容IE。(网上说的 disableautocomplete 我试了下不能阻止360就没再用。)
于是自己尝试着写了个方法,页面里相应的input写成type=text,当页面加载好后,执行一个10毫秒的定时器,remove掉这些input,重新给页面里添加type=password 的input 。相对应的事件都改成用on绑定。 firefox下自动填充的问题解决了,并且也兼容了IE,但是。。。360浏览器你什么时候添加他什么时候就给你填充!┻━┻︵╰(‵□′)╯︵┻━┻ ,这时候发现网易邮箱的输入框是这么写的 autocomplete="new-password" ,尝试试了一下,竟然成功兼容360了!然后试了下 readonly ,写在定时器里removeAttr 掉只读属性,也能阻止360浏览器自动填充。
HTML5 中的新属性autocomplete="off"失效的解决方法(兼容firefox,IE,360)的更多相关文章
- 小强的HTML5移动开发之路(13)——HTML5中的全局属性
来自:http://blog.csdn.net/dawanganban/article/details/18179483 一.accssskey 快捷键 <!DOCTYPE HTML> ...
- HTML5表单新属性
HTML5表单新属性 autofocus 自动聚焦 <input type="text" autofocus> placeholder占位文本 tel ...
- jquery中checkbox全选失效的解决方法
这篇文章主要介绍了jquery中checkbox全选失效的解决方法,需要的朋友可以参考下 如果你使用jQuery 1.6 ,代码if ( $(elem).attr(“checked”) ),将 ...
- Easyui中使用jquery或js动态添加元素时出现的样式失效的解决方法
Easyui中使用jquery或js动态添加元素时出现的样式失效的解决方法 2014-03-27 11:44:46| 分类: Easy UI|举报|字号 订阅 可以使用$.parser.pa ...
- Web设计中打开新页面或页面跳转的方法 js跳转页面
Web设计中打开新页面或页面跳转的方法 一.asp.net c# 打开新页面或页面跳转 1. 最常用的页面跳转(原窗口被替代):Response.Redirect("newpage.aspx ...
- Mybatis中实体类属性与数据库列表间映射方法介绍
这篇文章主要介绍了Mybatis中实体类属性与数据列表间映射方法介绍,一共四种方法方法,供大家参考. Mybatis不像Hibernate中那么自动化,通过@Co ...
- margin-top失效的解决方法
异常处理汇总-前端系列 http://www.cnblogs.com/dunitian/p/4523015.html 我的是属于这种情况 按照网上的说法,我就是这个现象了 两个层box1和box2,b ...
- ode.js 版本控制 nvm 和 n 使用 及 nvm 重启终端失效的解决方法
今天的话题包括2个部分 node.js 下使用 nvm 或者 n 来进行版本控制 nvm 安装node.js 版本后,重启终端 node , npm 环境变量失效 第一部分 用什么来管理 node.j ...
- [datatable]关于在DataTable中执行DataTable.Select("条件")返回DataTable的解决方法
-- :09关于在DataTable中执行DataTable.Select("条件")返回DataTable的解决方法 在实际编程工程中,常常遇到这样的情况:DataTable并不 ...
随机推荐
- 另类vs2015+xamarin 的android界面乱码 解决
text.Text += "验证key 验证出错! 请在 AndroidManifest.xml 文件中检查 key 设置"; 代码就上面一行,单步走之前text.Text里面是汉 ...
- B-index、bitmap-index、text-index使用场景详解
索引的种类:B-tree索引.Bitmap索引.TEXT index1. B-tree索引介绍: B-tree 是一种常见的数据结构,也称多路搜索树,并不是二叉树.B-tree 结构可以显著减少定位 ...
- 与VS集成的若干种代码生成解决方案[博文汇总(共8篇)]
http://www.cnblogs.com/artech/archive/2010/11/17/CodeGeneration.html [第1篇] 通过CodeDOM定义生成代码的结构 我 不知道大 ...
- Python3.5 用 pip 安装lxml时出现 “Unable to find vcvarsall.bat ”?(转载)
来自:https://www.zhihu.com/question/26857761 解决步骤: 1. 安装wheel,命令行运行: pip install wheel 2.在这里下载对应的.whl文 ...
- 使用扩展方法将DataTable转换为List<T>
在将DataTable转换为List<T>时,找到了网上的方案,原文链接:http://stackoverflow.com/questions/4593663/fetch-datarow- ...
- Selenium2入门(二)WebDriver
前文Selenium2入门(一)说到Selenium是Web 应用程序测试框架,那么如果对一个简单的web应用需求:打开浏览器,登录百度首页,输入“欧洲杯”关键词,点击搜索按钮 这一系列操作,能否用S ...
- 利用百度云免费备份SQL数据库
我们开发了一个会员管理系统,随着使用的人越来越多,异地备份数据库就显得十分重要,万一硬盘出问题了怎么办呢.所以就着手做这个工作. 首先呢,找到了几个专门用来提供备份数据库的网站,一年好几百,好贵.放弃 ...
- docker底层技术概览
docker解决了云计算环境难于分发并且管理复杂,而用KVM.Xen等虚拟化又浪费系统资源的问题.Docker最初是基于lxc构建了容器引擎,为了提供跨平台支持,后又专门开发了libcontainer ...
- MethodInvoker 创建委托
if (this.InvokeRequired) this.Invoke(new MethodInvoker(() => { this.Close(); })); else this.Close ...
- MyBatis学习(二)、SQL语句映射文件(2)增删改查、参数、缓存
二.SQL语句映射文件(2)增删改查.参数.缓存 2.2 select 一个select 元素非常简单.例如: <!-- 查询学生,根据id --> <select id=" ...