zoukankan      html  css  js  c++  java
  • 前端解决用户登录时,禁止chrome提示用户保存密码

    网上很多方法,大多都是不生效的,在谷歌浏览器下依然存在问题。

    比如以下方法:

    1、为密码框input添加autocomplete="off"属性

    2、改变readonly属性

    <input type="password" class="layui-input" autocomplete="new-password"  readonly
                           onfocus="this.removeAttribute('readonly');" onblur="this.setAttribute('readonly',true);" />

    3、在前面加一个隐藏的input框

    <input type="password" class="layui-input" style="display: none;"/>
    <input type="password" class="layui-input" autocomplete="off" />

    以上3种无法解决问题,原因是type="password"的时候,浏览器就会弹出提示框,所以type不能是password。

    可以将type设置为text,然后用设置style属性为 -webkit-text-security:disc; 这样输入的text会变为....

    以下是谷歌的解决方案

    <html>
    <head>
       <title> Remove Save Password Pop Up For Chrome </title>
       <style>
           #txtPassword{
               -webkit-text-security:disc;
           }
       </style>
    </head>
    <body>
       <input type="text" id="txtUserName" />
       <br />
       <input type="text" id="txtPassword" />
       <br />
    </body>
    </html>

    火狐的解决方案

    <html>
    <head>
      <title> Remove Save Password Pop Up For Mozilla </title>
      <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js" type="text/javascript">
      <script>
          function RemoveSavedPassword() {
             if (jQuery.browser.webkit == undefined) {
                 inputValue = $('.real-input').val();
                 numChars = inputValue.length;
                 showText = "";
            for (i = 0; i < numChars; i++) {
                showText += "&#8226;";
            }
            $('.fake-input').html(showText);
        }
     }
      </script>
    </head>
    <body>
        <div class="input-box">
           <label>Enter password:</label>
           <div class="fake-input"></div>
           <input type="text" onKeyUp="RemoveSavedPassword()" class="real-input">
        </div>
    </body>
    </html>

    可参考一下链接

    https://stackoverflow.com/questions/32775342/how-to-disable-chromes-saved-password-prompt-setting-through-javascript

  • 相关阅读:
    Eclipse版本
    关于软件版本的说明
    JDK
    java2的三个版本
    vue 自定义下拉选择table组件
    网络图片转base64
    关于重力加速计文章
    整理 node-sass 安装失败的原因及解决办法
    kurentoClient
    es2020
  • 原文地址:https://www.cnblogs.com/interesting-whh/p/15261425.html
Copyright © 2011-2022 走看看