如何在主要浏览器中禁用特定输入(或表单字段)的自动完成?


当前回答

提供的答案在我测试的所有浏览器上都不起作用。基于已经提供的答案,这是我最终在Chrome 61、Microsoft Edge 40(EdgeHTML 15)、IE 11、Firefox 57、Opera 49和Safari 5.1上测试的结果。由于多次试验,它很古怪;然而,它确实对我有用。

<form autocomplete="off">
    ...
    <input type="password" readonly autocomplete="off" id="Password" name="Password" onblur="this.setAttribute('readonly');" onfocus="this.removeAttribute('readonly');" onfocusin="this.removeAttribute('readonly');" onfocusout="this.setAttribute('readonly');" />
    ...
</form> 

<script type="text/javascript">
    $(function () {           
        $('input#Password').val('');
        $('input#Password').on('focus', function () {
        if (!$(this).val() || $(this).val().length < 2) {
            $(this).attr('type', 'text');
        }
        else {
            $(this).attr('type', 'password');
        }
    });
    $('input#Password').on('keyup', function () {
        if (!$(this).val() || $(this).val().length < 2) {
            $(this).attr('type', 'text');
        }
        else {
            $(this).attr('type', 'password');
        }
    });
    $('input#Password').on('keydown', function () {
        if (!$(this).val() || $(this).val().length < 2) {
            $(this).attr('type', 'text');
        }
        else {
            $(this).attr('type', 'password');
        }
    });
</script>

其他回答

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

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

只需每次将输入元素中的name属性更改为唯一的属性,它就不会再次自动完成!

一个例子可能是结尾处添加的时间tic。您的服务器只需要解析文本名称的第一部分即可检索回值。

<input type="password" name="password_{DateTime.Now.Ticks}" value="" />

2022年9月

一些浏览器,如Google Chrome,甚至不关心autocomplete属性的值。停止获取建议的最佳方法是将输入的name属性更改为随时间变化的属性

截至2022年9月,浏览器将不提供一次性密码自动完成功能

所以我们可以使用otp作为域名。

<input name=“otp”>

为了解决这个问题,我使用了一些CSS技巧和以下工作。

input {
    text-security:disc;
    -webkit-text-security:disc;
    -mox-text-security:disc;
}

请阅读本文了解更多详情。

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

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

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