如果不使用客户端和服务器端代码的组合，似乎不可能实现这一点。

为了确保用户每次都必须填写表单而不必自动完成，我使用了以下技术：

在服务器上生成表单字段名称，并使用隐藏的输入字段来存储这些名称，以便在提交到服务器时，服务器端代码可以使用生成的名称来访问字段值。这是为了阻止用户选择自动填充字段。在表单上放置每个表单字段的三个实例，并使用css隐藏每个集合的第一个和最后一个字段，然后在使用javascript加载页面后禁用它们。这是为了防止浏览器自动填写字段。

这里有一个fiddle演示了javascript、css和html，如#2所述https://jsfiddle.net/xnbxbpv4/

javascript代码：

$(document).ready(function() {
    $(".disable-input").attr("disabled", "disabled");
});

css：

.disable-input {
  display: none;
}

html格式：

<form>
<input type="email" name="username" placeholder="username" class="disable-input">
<input type="email" name="username" placeholder="username">
<input type="email" name="username" placeholder="username" class="disable-input">
<br>
<input type="password" name="password" placeholder="password" class="disable-input">
<input type="password" name="password" placeholder="password">
<input type="password" name="password" placeholder="password" class="disable-input">
<br>
<input type="submit" value="submit">
</form>

下面是一个使用asp.net和razor的服务器代码的粗略示例

型号：

public class FormModel
{
    public string Username { get; set; }
    public string Password { get; set; }
}

控制器：

public class FormController : Controller
{
    public ActionResult Form()
    {
        var m = new FormModel();

        m.Username = "F" + Guid.NewGuid().ToString();
        m.Password = "F" + Guid.NewGuid().ToString();

        return View(m);
    }

    public ActionResult Form(FormModel m)
    {
        var u = Request.Form[m.Username];
        var p = Request.Form[m.Password];

        // todo: do something with the form values

        ...

        return View(m);
    }
}

视图：

@model FormModel

@using (Html.BeginForm("Form", "Form"))
{
    @Html.HiddenFor(m => m.UserName)
    @Html.HiddenFor(m => m.Password)

    <input type="email" name="@Model.Username" placeholder="username" class="disable-input">
    <input type="email" name="@Model.Username" placeholder="username">
    <input type="email" name="@Model.Username" placeholder="username" class="disable-input">
    <br>
    <input type="password" name="@Model.Password" placeholder="password" class="disable-input">
    <input type="password" name="@Model.Password" placeholder="password">
    <input type="password" name="@Model.Password" placeholder="password" class="disable-input">
    <br>
    <input type="submit" value="submit">
}

您可以在属性name how电子邮件地址中向表单添加名称，并生成电子邮件值。例如：

<form id="something-form">
  <input style="display: none" name="email" value="randomgeneratevalue"></input>
  <input type="password">
</form>

如果使用此方法，Google Chrome将无法插入自动填充密码。

自动填充功能在不选择字段的情况下更改值。我们可以在状态管理中使用它来忽略选择事件之前的状态更改。

React中的一个示例：

import React, {Component} from 'react';

class NoAutoFillInput extends Component{

    constructor() {
        super();
        this.state = {
            locked: true
        }
    }

    onChange(event){
        if (!this.state.locked){
            this.props.onChange(event.target.value);
        }
    }

    render() {
        let props = {...this.props, ...{onChange: this.onChange.bind(this)}, ...{onSelect: () => this.setState({locked: false})}};
        return <input {...props}/>;
    }
}

export default NoAutoFillInput;

如果浏览器尝试填充字段，则元素仍被锁定，状态不受影响。现在，您可以用NoAutoFillInput组件替换输入字段，以防止自动填充：

<div className="form-group row">
    <div className="col-sm-2">
        <NoAutoFillInput type="text" name="myUserName" className="form-control" placeholder="Username" value={this.state.userName} onChange={value => this.setState({userName: value})}/>
    </div>
    <div className="col-sm-2">
        <NoAutoFillInput type="password" name="myPassword" className="form-control" placeholder="Password" value={this.state.password} onChange={value => this.setState({password: value})}/>
    </div>
</div>

当然，这个想法也可以用于其他JavaScript框架。

大多数答案都没有帮助，因为浏览器只是忽略了它们。（其中一些不兼容跨浏览器）。对我有效的修复方法是：

<form autocomplete="off">
    <input type="text" autocomplete="new-password" />
    <input type="password" autocomplete="new-password" />
</form>

我在表单标签上设置autofill=“off”，在不需要自动填充的地方设置autofil=“new password”。

将输入保留为文本类型并隐藏。在DOMContentLoaded上，调用一个函数来更改密码类型并显示字段，延迟1秒。

document.addEventListener（'DOMContentLoaded'，changeInputsType）；函数更改InputsType（）{setTimeout（函数）{$（/*selector*/）.prop（“type”，“password”）.show（）；}, 1000);}

定义输入的属性type=“text”和autocomplete=“off”足以为我关闭自动完成。

除了type=“password”之外，我尝试使用JavaScript钩住别人的建议中的onfocus/onfocuout事件来切换只读属性，效果很好，但当密码字段编辑开始为空时，自动完成密码再次出现。

我建议除了上述工作正常的解决方法之外，还可以使用JavaScript挂钩oninput事件来切换关于密码长度的类型属性。。

<input id="pwd1" type="text" autocomplete="off" oninput="sw(this)" readonly onfocus="a(this)" onfocusout="b(this)" />
<input id="pwd2" type="text" autocomplete="off" oninput="sw(this)" readonly onfocus="a(this)" onfocusout="b(this)" />

和JavaScript。。

function sw(e) {
    e.setAttribute('type', (e.value.length > 0) ? 'password' : 'text');
}
function a(e) {
    e.removeAttribute('readonly');
}
function b(e) {
    e.setAttribute('readonly', 'readonly');
}