zoukankan      html  css  js  c++  java
  • 关闭form上chrome的autofill

    Chrome的autofill会自动找到form中的type=password的元素,然后把这个元素前面的元素当做是用户名,它不在乎这个元素叫什么名字。这样又是注册又是登录,你会发现它自作聪明的autofill很是烦人,这个是chrom已知的问题,不知道为啥没修复。在stackoverflow上找到了答案:
    http://stackoverflow.com/questions/21168367/angularjs-chrome-autocomplete-dilemma#answer-37490925


    ###解决办法 添加`autocomplete="off"`或者`display=none`都是无效的,下面的方法完美解决

    定义下面的指令,然后加到form的最上面,chrome就会认为这个是password。

    module.directive("fakeAutocomplete", [
      function () {
        return {
          restrict: "EA",
          replace: true,
          template: "<div><input/><input type="password"/></div>",
          link: function (scope, elem, attrs) {
            elem.css({
              "overflow": "hidden",
              "width": "0px",
              "height": "0px"
            });
          }
        }
      }
    ]);
    

    使用

            <form name="loginForm" novalidate ng-submit="loginPost()" class="navbar-form navbar-right" ng-hide="login">
                <fake-autocomplete></fake-autocomplete>
                <div class="form-group">
                    <input name="user_name" required ng-maxlength="50" type="text" class="form-control" placeholder="手机号或邮箱" ng-model="account.user_name">
                    <span class="error" ng-show="loginForm.$submitted && loginForm.user_name.$error.required">*用户名不能为空</span>
                    <span class="error" ng-show="loginForm.$submitted && loginForm.user_name.$error.maxlength">*用户名最大长度50位</span>
                </div>
                <div class="form-group">
                    <input name="password" required type="password" ng-minlength="6" ng-maxlength="50" class="form-control" placeholder="密码" ng-model="account.password">
                    <span class="error" ng-show="loginForm.$submitted && loginForm.password.$error.required">*密码不能为空</span>
                    <span class="error" ng-show="loginForm.$submitted && loginForm.password.$error.minlength">*密码不能少于6位</span>
                    <span class="error" ng-show="loginForm.$submitted && loginForm.password.$error.maxlength">*密码最大长度50位</span>
                </div>
                <button type="submit" class="btn btn-default"><span class="glyphicon glyphicon-lock"></span> 登录</button>
            </form>
    

    使用前后对比


  • 相关阅读:
    tkinter gui界面使用调戏妹子
    @property 用法
    @classmehod 用法解析
    python psutil 使用和windows 10 设置
    python 类多重继承问题
    多线程同步引入锁
    Linux—禁止用户SSH登录方法总结
    Linux FTP的主动模式与被动模式
    Java Socket详解
    MySQL学习(一)——创建新用户、数据库、授权
  • 原文地址:https://www.cnblogs.com/wancy86/p/autofill.html
Copyright © 2011-2022 走看看