当输入类型为密码时，autocomplete ='off'不起作用，并在其上方输入输入字段以启用自动完成功能
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了当输入类型为密码时，autocomplete ='off'不起作用，并在其上方输入输入字段以启用自动完成功能相关的知识，希望对你有一定的参考价值。
我有一个禁用自动完成功能的表单但它不起作用并使自动完成功能在firefox和更高版本的chrome中启用
<form method="post" autocomplete="off" action="">
<ul class="field-set">
<li>
<label>Username:</label>
<input type="text" name="acct" id="username" maxlength="100" size="20">
</li>
<li>
<label>Password:</label>
<input type="password" name="pswd" id="password" maxlength="16" size="20" >
</li>
<li>
<input type="submit" class="button" value="Login" id="Login" name="Login">
</li>
</ul>
</form>
当类型从密码更改为文本时，它适用于所有浏览器。任何人都可以帮忙解决这个问题吗？
浏览器通常有两个相关但不同的表单功能：
- 表单自动完成，其中
<input type="text">类型（和类似）的项目收集类型值并以下拉列表的形式提供它们。 （这是一个非常好用的简单功能。） - 密码管理器，当浏览器检测到您提交了登录表单时，会提示您记住用户名/密码组合。返回网站时，大多数浏览器会在下拉框（Firefox，Chrome，Internet Explorer ...）中显示可用的用户名，但有些浏览器会显示工具栏按钮（Opera）。此外，Chrome会以硬编码黄色突出显示字段。 （这取决于启发式，在某些页面上可能会失败。）
有一个边缘案例，表格标记为autocomplete="off"。如果它是登录表单并且用户以前存储了用户名/密码会发生什么？实际上从本地数据库中删除密码看起来不合适，所以可能没有浏览器这样做。 （事实上，表单自动完成的数据也不会被删除。）Firefox决定给用户供电：你有密码，所以我会让你使用它。 Chrome决定为网站供电。
对于文本类型，请使用autocomplete="off"或autocomplete="false"
<input id="username" type="text" autocomplete="false">
对于密码类型，请使用autocomplete="new-password"
<input id="password" type="password" autocomplete="new-password">
我发现如果输入没有名称（例如，未设置name属性），则浏览器无法自动填充该字段。我知道这不是每个人的解决方案，但如果您通过AJAX提交表单，您可以试试这个。
添加autocomplete="off"不会削减它 - 它被Chrome忽略了。
将输入类型属性更改为type="search"。
Google不会将自动填充应用于具有某种搜索类型的输入。
为什么不是每个人都使用这个....
<form>
<div class="user">
<i> </i>
<input type="text" id="u1" name="u1" value="User Name" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'User Name';}">
</div>
<div class="user1">
<i> </i>
<input type="password" id="p1" name="p1" value="Password" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Password';}" >
</div>
<div class="user2">
<input type="submit" value="Login">
</div>
</form>
这很简单...... :)
我的溶胶：
<input oninput="turnOnPasswordStyle()" id="inputpassword" type="text">
function turnOnPasswordStyle(){
$('#inputpassword').attr('type', "password");
}
我知道这是一个老问题，但浏览器一直在变化。虽然这里提到的一些answers提到了这样的问题：在密码字段上方创建一个临时文本框并隐藏它可能在过去有效，但目前阻止浏览器弹出密码管理器的最简单方法是至少拥有三个单独的额外隐藏密码输入，每个都有不同的虚拟值，如下所示：
<form method="post" autocomplete="off" action="">
<ul class="field-set">
<li>
<label>Username:</label>
<input type="text" name="acct" id="username" maxlength="100" size="20">
</li>
<li>
<label>Password:</label>
<input type="password" name="pswd" id="password" maxlength="16" size="20" >
<input type="password" style="display: none;" value="dummyinput1"/>
<input type="password" style="display: none;" value="dummyinput2"/>
<input type="password" style="display: none;" value="dummyinput3"/>
</li>
<li>
<input type="submit" class="button" value="Login" id="Login" name="Login">
</li>
</ul>
</form>
尝试设置autocomplete =“new-password”，如下所示：
<input type="password" name="pswd" id="password" maxlength="16" size="20" autocomplete="new-password" />
对于密码，它目前无法正常工作。
所以默认情况下将密码字段设为文本并使用以下js代码。
$('#real-password').on('input', function(){
if ($(this).val() !== '') {
$(this).attr('type', 'password');
} else {
$(this).attr('type', 'text');
}
});在现代浏览器中，autocomplete=off在很大程度上被忽略了 - 主要是由于密码管理器等。
您可以尝试添加此autocomplete="new-password"它并非所有浏览器都完全支持，但它适用于某些浏览器
<form method="post" autocomplete="off" action="">
<ul class="field-set">
<li>
<label>Username:</label>
<input type="text" name="acct" id="username" maxlength="100" size="20">
</li>
<li>
<label>Password:</label>
<input type="text" style="display:none;">
<input type="password" name="pswd" id="password" maxlength="16" size="20" autocomplete="new-password">
</li>
...
</ul> </form><input type="password" placeholder="Enter Password" class="form-control" autocomplete="new-password">
干得好。
您可以在表单加载时只读取字段。当该字段获得焦点时，您可以将该字段更改为可编辑。这是避免自动完成的最简单方法。
<input name="password" id="password" type="password" autocomplete="false" readonly onfocus="this.removeAttribute('readonly');" />
我最近遇到了这个问题，并且没有简单的解决方案，因为我的字段可以预先填充，我想通过在ready事件中设置密码类型来分享我提出的优雅黑客。
在创建时不要将输入字段声明为类型密码，而是添加一个ready事件监听器以使用jQuery为您添加它：
<input type="text" name="pswd" id="password" maxlength="16" size="20" >
<script>
$(function(){
document.getElementById('password').setAttribute('type', 'password');
});
</script>
我认为此问题特定于浏览器（chrome），因此您可以通过仅为chrome添加条件来管理。
@html.PasswordFor(model => model.Password, new { @autocomplete = (Request.Browser.Browser.ToLower().Contains("chrome") ? "new-password" : "off") })
@autocomplete =（Request.Browser.Browser.ToLower（）。包含（“chrome”）？“new-password”：“off”）
刚刚找到另一个简单的解决方案，并在所有3个主要浏览器Chrome Firefox和Opera上为我工作
<input type="text" onfocus="this.type='email'"/>
<input type="text" onfocus="this.type='password'"/>
另一种方法是在页面加载时清除密码字段的值，而不是试图阻止它自动填充。
使用jQuery只需添加如下内容：
$(function() { $('#password_field').val(''); });
当我遇到同样的问题时，我通过在密码字段上方创建一个临时文本框并将其隐藏来解决
像这样，
<form method="post" autocomplete="off" action="">
<ul class="field-set">
<li>
<label>Username:</label>
<input type="text" name="acct" id="username" maxlength="100" size="20">
</li>
<li>
<label>Password:</label>
<input type="text" style="display:none;">
<input type="password" name="pswd" id="password" maxlength="16" size="20" >
</li>
...
</ul> </form>
它将使username文本字段不显示下拉列表中任何以前键入的单词。由于没有像name这样的属性，id用于输入字段<input type="text" style="display:none;">，它也不会发送任何额外的参数。
我不确定这是一个好习惯，但它会解决这个问题。
这将阻止密码自动填入输入字段（type =“password”）。
<form autocomplete="off">
<input type="pas以上是关于当输入类型为密码时，autocomplete ='off'不起作用，并在其上方输入输入字段以启用自动完成功能的主要内容，如果未能解决你的问题，请参考以下文章
autocomplete = new-password并通过再次输入密码让他们确认
如何使用 Chrome 浏览器在 ASP.Net 中停止将输入类型自动填充为密码