zoukankan      html  css  js  c++  java
  • 消除浏览器对input输入框的自动填充

    Mozilla官方文档建议的是 直接使用 autocomplete = ‘off’ 即可禁止输入框从浏览器cache获取数据,博主以前使用这个也就足够兼容浏览器了。

    现在发现,却在chrome、firfox上有兼容性 无法解决。

    后来查阅相关资料得到以下解决方法:

    1:可以设置一个默认的input用来接收浏览器的默认填充,并且设置css为dispaly:none

    形如:

    <input type = 'text' style='display:none'>
    

    这样既不会影响用户的体验,也可以兼容所有的浏览器,但经过测试却发现,在chrome上不起作用,在firefox上也只能对type != password的 输入框起作用。

    2:autocomplete = 'new-password'

    <input type='text' >
    <input type='password' autocomplete='new-password' >
    

    使用上诉代码,在chrome上既可生效,用户名与密码都不会自动填充,但是firefox上任然会自动填充用户名

    3:结合上诉两个情况

    <input type='text' style='display:none'> <!-- 针对firefox -->
    用户名:<input type='text' autocomplete='off'> 
    密码:<input type='password' autocomplete='new-password'>
    

    既可解决针对chrome与firefox内核的浏览器自动填充输入框的问题

    4:但是近期经过测试发现 这种方法还是不能解决firefox上密码框的历史输入,可以:3步骤上做这样的操作:

    <input type='password' autocomplete="new-password" style="background-color: #FFFFFF!important;" readonly onfocus="this.removeAttribute('readonly');" onblur="this.setAttribute('readonly',true);" />>
    
  • 相关阅读:
    poj-3580-SuperMemo-splay
    JS 添加到事件的多个对象
    1.9 效率高,安排约会
    我展示了视频采集前端vfe和camera,decode等交互驱动的体系结构
    2013年7月27日杂记
    深入JS系列学习4
    深入JS系列学习3
    深入JS系列学习2
    高质量JavaScript代码书写基本要点学习
    给硬件复兴把脉 硬件创新最有机会的十个方向
  • 原文地址:https://www.cnblogs.com/bluealine/p/10755220.html
Copyright © 2011-2022 走看看