没有一个解决方案对我有效。最后，在花了好几个小时后，我想出了这个ReactJS的解决方案。

在FireFox 54.0.1, Chrome 61.0.3163.100, Mac OS 10.13上测试

我保持类型=“文本”，并将其更改为onChange事件上的相关类型。

例: HTML:

<输入类型=“文本”占位符=“电子邮件”/>

JS:

setAttr2: function(e){
    var value = e.target.value;
    if(value.length){
      e.target.setAttribute('type', 'email')
    } else {
      e.target.setAttribute('type', 'text')
    }
  }

你必须添加这个属性:

autocomplete="new-password"

来源链接:全文

为用户名字段输入值' '(空格)。

<input type = 'text' value = ' ' name = 'username' />

如果您曾经用用户输入的值填充用户名，如果没有用户输入的值，则编码输入' '。

编辑:我还不得不改变'用户名'字段有一个其他的名字，而不是'用户名'，例如。“nameofuser”

试试下面对我有用的jQuery代码。

if ($.browser.webkit) {
    $('input[name="password"]').attr('autocomplete', 'off');
    $('input[name="email"]').attr('autocomplete', 'off');
}

乔宾的回答让我吃了一惊。以下是对我有效的方法:

<input type="password" name="password" id="password_fake" style="display:none;" />
<input type="password" name="password"/>

确保不要使用autocomplete="off"，否则会破坏解决方案。

我的解决方案取决于三件事:

keydown事件 屏蔽字段名 在提交时删除字段值

首先，我们需要防止用户名和密码都自动补全，因此，最初我们将设置两个标志，i ->用户名和j ->密码为真值，因此如果没有任何keydown字段，i和j都将为真。

在可能的情况下，字段屏蔽发生在服务器端，通过传递随机字符串，它也可以很容易地使用客户端。

这是代码:

$(document).ready(function(){
   i= true; //username flag
   j= true; // password flag
   $("#username{{$rand}}").keydown(function(e){
          // {{$rand}} is server side value passed in blade view
          // keyboard buttons are clicked in the field
            i = false;       
    });
   $("#passowrd{{$rand}}").keydown(function(e){
          // {{$rand}} is server side value passed in blade view
          // keyboard buttons are clicked in the field
            j = false;       
    });
    // Now we will use change event,
   $("#username{{$rand}}").change(function(){
    if($(this).val() != ''){ //the field has value
        if(i){ // there is no keyboard buttons clicked over it
            $(this).val(''); // blank the field value
        }

    }
})
$("#password{{$rand}}").change(function(){
    if($(this).val() != ''){ // the same as username but using flag j
        if(j){
            $(this).val('');
        }

    }
})

   $("#sForm").submit(function(e){ // the id of my form
      $("#password-s").val($("#password{{$rand}}").val());
        $("#username-s").val($("#username{{$rand}}").val());
        // Here the server will deal with fields names `password` and `username` of the hidden fields
       $("#username{{$rand}}").val('');
        $("#password{{$rand}}").val(''); 

 })
})

下面是HTML:

<form class="form-horizontal" autocomplete="off" role="form" id="sForm" method="POST" action="https://example.com/login">

                        <input type="hidden" name="password" id="password-s">
                        <input type="hidden" name="username" id="username-s">

                            <label for="usernameTDU3m4d3I5" class="col-md-3 control-label" style="white-space: nowrap">Username</label>

                                <input id="usernameTDU3m4d3I5" placeholder="Username" autocomplete="off" style="border-bottom-left-radius: 10px; border-top-right-radius: 10px; font-family: fixed; font-size: x-large;" type="text" class="form-control" name="usernameTDU3m4d3I5" value="" required="required" autofocus="">                                

                            <label for="passwordTDU3m4d3I5" class="col-md-3 control-label" style="white-space: nowrap">Password</label>
                                <input id="passwordTDU3m4d3I5" placeholder="Password" autocomplete="off" type="password" class="form-control" name="pa-TDU3m4d3I5" required="">


                                <button type="submit" class="btn btn-success">
                                    <i class="fox-login" style="text-shadow: 0px 1px 0px #000"></i><strong>Login</strong>&nbsp;&nbsp;
                                </button>

                                </form>

上述解决方案确实不会消除或阻止用户名和密码的自动补全，但它使自动补全无用。也就是说，在没有敲击键盘按钮的情况下，字段值在提交之前将是空白的，因此用户将被要求输入它们。

更新

我们也可以，使用点击事件来防止自动完成用户列表出现在字段下面，如下所示:

 $("#username{{$rand}}").click(function(){

            $(this).val('');
            i = true;

})
$("#password{{$rand}}").click(function(){

            $(this).val('');
            j = true;

})

限制:

这种解决方案可能无法在触摸屏设备中正常工作。

最后的更新

我已经完成了如下干净的实现:

preventAutoComplete = true; // modifier to allow or disallow autocomplete
trackInputs = {password:"0", username:"0"}; //Password and username fields ids as object's property, and "0" as its their values
// Prevent autocomplete
    if(preventAutoComplete){
        $("input").change(function(e){ // Change event is fired as autocomplete occurred at the input field 
            trackId = $(this).attr('id'); //get the input field id to access the trackInputs object            
            if (trackInputs[trackId] == '0' || trackInputs[trackId] != $(this).val()){ //trackInputs property value not changed or the prperty value ever it it is not equals the input field value
                $(this).val(''); // empty the field
            }
        });
        $("input").keyup(function(e){
            trackId = $(this).attr('id');
            trackInputs[trackId] = $(this).val(); //Update trackInputs property with the value of the field with each keyup.
        });
    }