html -如何禁用web窗体字段/输入标记上的浏览器自动完成功能?

Translate

你如何禁用autocomplete在特定的主要浏览器中input(要么form field)?

This question and all comments follow the "Attribution Required."

所有的回答

Translate

Firefox 30忽略autocomplete="off"输入密码,请选择提示用户是否将密码存储在客户端上。注意以下评论从2014年5月5日开始:

  • 密码管理器总是提示是否要保存密码。未经用户许可,不会保存密码。
  • 我们是继IE和Chrome之后第三个实现此更改的浏览器。

根据Mozilla开发人员网络文档,布尔表单元素属性autocomplete防止将表单数据缓存在较旧的浏览器中。

<input type="text" name="foo" autocomplete="off" />
来源
Translate

此外autocomplete=off,您还可以通过生成页面的代码将表单字段名称随机化,也许可以通过在名称末尾添加一些特定于会话的字符串来实现。

提交表单后,您可以先剥离该部分,然后再在服务器端对其进行处理。这将阻止Web浏览器为您的字段查找上下文,也可能有助于防止XSRF攻击,因为攻击者将无法猜测表单提交的字段名称。

来源
Translate

现在,大多数主要的浏览器和密码管理器(正确的是恕我直言)都会忽略autocomplete=off.

为什么?添加了许多银行和其他“高安全性”网站autocomplete=off“出于安全目的”登录到他们的登录页面,但这实际上降低了安全性,因为这会导致人们更改这些高安全性站点上的密码,从而容易记住(从而破解),因为自动完成功能被破坏了。

很久以前,大多数密码管理员开始忽略autocomplete=off,现在浏览器开始仅对用户名/密码输入执行相同的操作。

不幸的是,自动完成实现中的错误将用户名和/或密码信息插入到不合适的表单字段中,从而导致表单验证错误,或者更糟的是,意外地将用户名插入用户故意留空的字段中。

Web开发人员要做什么?

  • 如果您可以将所有密码字段单独保留在页面上,那么这是一个很好的开始,因为似乎密码字段的存在是触发用户/密码自动完成功能的主要触发因素。否则,请阅读以下提示。
  • 苹果浏览器请注意,这里有两个密码字段,并且在这种情况下会禁用自动完成功能,前提是该密码必须是更改密码形式,而不是登录形式。因此,请确保在您允许的任何表单中使用2个密码字段(新密码并确认新密码)
  • 不幸的是,每当看到密码字段时,34都会尝试使用用户/密码自动填充字段。这是一个非常糟糕的错误,希望它们会改变Safari的行为。但是,将其添加到表单顶部似乎会禁用密码自动填充功能:

    <input type="text" style="display:none">
    <input type="password" style="display:none">
    

我尚未彻底调查IE或Firefox,但如果其他人在评论中有信息,我将很乐意更新答案。

来源
Translate

有时甚至自动完成=关闭不阻止填补凭据中的错误字段,但不包括用户或昵称字段。

此解决方法是apinstein关于浏览器行为的文章的补充。

修复浏览器以只读方式自动填充并设置为可写焦点(单击和标签)

 <input type="password" readonly  
     onfocus="this.removeAttribute('readonly');"/>

更新:Mobile Safari在该字段中设置了光标,但不显示虚拟键盘。 New Fix的工作原理与以前相同,但是可以处理虚拟键盘:

<input id="email" readonly type="email" onfocus="if (this.hasAttribute('readonly')) {
    this.removeAttribute('readonly');
    // fix for mobile safari to show virtual keyboard
    this.blur();    this.focus();  }" />

现场演示https://jsfiddle.net/danielsuess/n0scguv6/

// UpdateEnd

因为浏览器会自动将凭据填充到错误的文本字段!?

当其中存在密码字段时,我注意到Chrome和Safari上的这种奇怪行为相同的形式。我想浏览器会在密码字段中插入您保存的凭据。然后,它会自动填充(只是由于观察而猜测)最接近的类似text-input的字段,该字段出现在DOM中的password字段之前。由于浏览器是最后一个实例,您无法控制它,

上面的只读修复对我有用。

来源
Translate
<form name="form1" id="form1" method="post" 
      autocomplete="off" action="http://www.example.com/form.cgi">

这将在Internet Explorer和Mozilla FireFox中工作,缺点是它不是XHTML标准。

来源
Translate

Chrome的解决方案是添加autocomplete="new-password"输入密码。

例:

<form name="myForm"" method="post">
<input name="user" type="text" />
<input name="pass" type="password" autocomplete="new-password" />
<input type="submit">
</form>

Chrome会在发现以下情况时始终自动填充数据:输入密码,正好足以指示该框autocomplete = "new-password".

这对我来说很好。

注意:请确保使用F12所做的更改生效,许多浏览器将页面保存在缓存中,这给我留下了不好的印象,即该页面不起作用,但浏览器实际上并未带来更改。

来源
Translate

正如其他人所说,答案是autocomplete="off"

但是,我认为值得一提为什么最好在某些情况下使用它作为对此的一些答案,重复问题表明最好不要关闭它。

停止将存储信用卡号的浏览器留给用户。太多的用户甚至没有意识到这是一个问题。

禁用信用卡安全代码字段中的这一点尤其重要。如这一页状态:

“永远不要存储安全代码。它的价值取决于以下假设:提供该安全代码的唯一方法是从实物信用卡中读取该密码,从而证明提供该密码的人实际上持有该卡。”

问题是,如果这是一台公共计算机(网络咖啡馆,图书馆等),那么其他用户很容易窃取您的卡信息,甚至在您自己的计算机上,恶意网站也可能窃取自动完成数据.

来源
Translate

为了避免禁用自动完成功能,我不得不与这些答案有所不同。

首先要提到的是,未在登录表单字段上明确禁用自动完成功能是PCI-DSS失败。此外,如果用户的本地计算机受到威胁,则由于攻击者会以无格式存储任何自动完成的数据,因此攻击者可以轻松获取这些数据。

当然,可用性是有争议的,但是在哪些表单字段应禁用自动完成功能以及哪些不应该禁用自动完成功能方面,这是一个很好的平衡。

来源
Translate

三个选择:第一:

<input type='text' autocomplete='off' />

第二:

<form action='' autocomplete='off'>

第三(JavaScript代码):

$('input').attr('autocomplete', 'off');
来源
Translate

我已经通过使用随机字符解决了与Google Chrome浏览器的无休止的战斗。当您始终使用随机字符串呈现自动完成功能时,它将永远不会记住任何内容。

<input name="name" type="text" autocomplete="rutjfkde">

希望对其他人有帮助。

来源
Translate

在相关或实际上完全相反的音符上-

“如果您是上述表单的用户,并且想要重新启用自动完成功能,请使用此页面中的“记住密码”书签小书签页面。它删除所有autocomplete="off"页面上所有表单的属性。继续打好战斗!”

来源
Translate

我们确实使用了萨斯布一个网站的想法。这是一个运行医生办公室的医疗软件网络应用程序。但是,我们的许多客户都是外科医生,他们使用许多不同的工作站,包括半公共终端。因此,他们希望确保不了解自动保存密码含义或不注意的医生不会意外地使他们的登录信息易于访问。当然,这是在IE8,FF3.1等中开始采用私有浏览的想法之前。即使如此,许多医生还是被迫在医院使用老式IT不变的旧浏览器。

因此,我们让登录页面生成了仅适用于该帖子的随机字段名称。是的,它不太方便,但是它只是在不将登录信息存储在公共终端上的情况下打动了用户。

来源
Translate

刚设定autocomplete="off"。这样做有一个很好的理由:您想提供自己的自动完成功能!

来源
Translate

我一直在尝试无休止的解决方案,然后发现了这一点:

代替autocomplete="off"只是简单地使用autocomplete="false"

如此简单,它在Google Chrome浏览器中也具有魅力!

来源
Translate

我认为autocomplete=offHTML 5支持。

问问自己自己为什么要这样做-在某些情况下这可能是有道理的,但不要仅仅为了这样做而这样做。

这对用户来说不太方便,甚至在OS X中也没有安全问题(下面由Soren提到)。如果您担心别人的密码被远程窃取,即使您的应用使用了击键记录器,仍然可以做到这一点autcomplete=off.

作为选择使用浏览器的用户,我记得(大部分)信息,如果您的网站不记得我的信息,我会觉得很烦。

来源
Translate

在此对话中,没有任何解决方案对我有用。

我终于想通了纯HTML解决方案那需要没有JavaScript,可在现代浏览器中使用(IE浏览器除外;必须至少捕获1个,对吗?),并且不需要您禁用整个表单的自动完成功能。

只需在form然后将其打开input您希望它在表格中起作用。例如:

<form autocomplete="off">
    <!-- these inputs will not allow autocomplete and chrome 
         won't highlight them yellow! -->
    <input name="username"  />
    <input name="password" type="password" />
    <!-- this field will allow autocomplete to work even 
         though we've disabled it on the form -->
    <input name="another_field" autocomplete="on" />
</form>
来源
Translate

这对我有用。

<input name="pass" type="password" autocomplete="new-password" />

我们还可以在其他控件(例如文本,选择等)中使用此策略

来源
Translate

游戏有点晚了...但是我只是遇到了这个问题并尝试了几次失败,但是这个发现对我有用MDN

在某些情况下,即使将autocomplete属性设置为off,浏览器也会继续建议自动补全值。对于开发人员而言,这种意外行为可能会令人困惑。真正强制不完成的诀窍是为属性分配一个随机字符串,如下所示:

autocomplete="nope"
来源
Translate

最佳解决方案:

防止自动填充用户名(或电子邮件)和密码:

<input type="email" name="email"><!-- Can be type="text" -->
<input type="password" name="password" autocomplete="new-password">

防止自动填写字段:

<input type="text" name="field" autocomplete="nope">

说明:autocomplete继续从事<input>, autocomplete="off"不起作用,但是您可以更改off随机字符串,例如nope.

适用于:

  • 铬:49、50、51、52、53、54、55、56、57、58、59、60、61、62、63和64

  • Firefox:44、45、46、47、48、49、50、51、52、53、54、55、56、57和58

来源
Translate

尝试添加

readonly onfocus =“ this.removeAttribute('readonly');”

此外

autocomplete =“ off”

不想记住表单数据的输入(username, password等),如下所示:

<input type="text" name="UserName" autocomplete="off" readonly 
    onfocus="this.removeAttribute('readonly');" >

<input type="password" name="Password" autocomplete="off" readonly 
    onfocus="this.removeAttribute('readonly');" >


更新:以下是基于此方法的完整示例,可防止拖放, 复制,

<input type="text" name="UserName" style="text-transform:lowercase;" placeholder="Username" 
    autocomplete="off" readonly onfocus="this.removeAttribute('readonly');" 
    oncopy="return false" ondrag="return false" ondrop="return false" 
    onpaste="return false" oncontextmenu="return false" > 

<input type="password" name="Password" placeholder="Password" autocomplete="off" readonly 
    onfocus="this.removeAttribute('readonly');" oncopy="return false" ondrag="return false" 
    ondrop="return false" onpaste="return false" oncontextmenu="return false" >

在主要浏览器的最新版本上进行了测试,即Google Chrome, Mozilla Firefox, Microsoft Edge等等,并且没有任何问题。希望这可以帮助...

来源
Translate

添加

autocomplete="off"

到表单标签将禁用所有浏览器的自动完成功能(以前在该字段中键入的内容)input该特定形式的字段。

经过测试:

  • Firefox 3.5、4个测试版
  • Internet Explorer 8
来源
Translate

在字段中使用非标准名称和ID,因此“名称”不是“名称”。这样浏览器就不会将其视为名称字段。最好的部分是您可以对部分但不是全部字段执行此操作,它将自动完成部分但不是全部字段。

来源
Translate

为了避免无效的XHTML,您可以使用javascript设置此属性。使用jQuery的示例:

<input type="text" class="noAutoComplete" ... />

$(function() {
    $('.noAutoComplete').attr('autocomplete', 'off');
});

问题是没有JavaScript的用户将获得自动完成功能。

来源
Translate

新增中autocomplete="off"不会削减它。

将输入类型属性更改为type="search".
Google不会将自动填充应用于具有搜索类型的输入。

来源
Translate

如果只是尝试这些autocomplete="off"不起作用:

autocorrect="off" autocapitalize="off" autocomplete="off"
来源
Ben
Translate

我很难相信这已经被报道了这么久了。上面的解决方案对我不起作用,因为safari似乎知道什么时候该元素不显示或不在屏幕上,但是以下内容对我有用:

<div style="height:0px; overflow:hidden; ">
  Username <input type="text" name="fake_safari_username" >
  Password <input type="password" name="fake_safari_password">
</div>

希望对某人有用!

来源
Translate

这是浏览器现在忽略的安全问题。浏览器会使用输入名称来标识和存储内容,即使开发人员认为该信息是敏感信息,也不应该存储。使两个请求之间的输入名称不同将解决该问题(但仍将保存在浏览器的缓存中,并且还会增加浏览器的缓存)。要求用户在其浏览器的设置中激活或停用选项不是一个好的解决方案。该问题可以在后端修复。

这是我的解决办法。我在框架中实现的一种方法。所有自动完成元素都是通过隐藏输入生成的,如下所示:

<? $r = rmd5(rand().mocrotime(TRUE)); ?>
<form method="POST" action="./">
    <input type="text" name="<? echo $r; ?>" />
    <input type="hidden" name="__autocomplete_fix_<? echo $r; ?>" value="username" />
    <input type="submit" name="submit" value="submit" />
</form>

然后,服务器处理如下的post变量:

foreach ($_POST as $key => $val)
{
    if(preg_match('#^__autocomplete_fix_#', $key) === 1){
        $n = substr($key, 19);
        if(isset($_POST[$n]))$_POST[$val] = $_POST[$n];
    }
}

该值可以照常访问

var_dump($_POST['username']);

并且浏览器将无法根据先前的请求或先前的用户来建议信息。

即使浏览器进行了更新,所有操作都像一个超级按钮,还是要忽略自动填充。这是为我解决此问题的最佳方法。

来源
Translate

此处提到的所有技巧都无法在Chrome中为我工作。这里有一个关于这个问题的讨论:https://code.google.com/p/chromium/issues/detail?id=468153#c41

将此添加到<form>有效(至少目前如此):

<div style="display: none;">
    <input type="text" id="PreventChromeAutocomplete" name="PreventChromeAutocomplete" autocomplete="address-level4" />
</div>
来源
Translate

就是这样:

function turnOnPasswordStyle() {
  $('#inputpassword').attr('type', "password");
}
<input oninput="turnOnPasswordStyle()" id="inputpassword" type="text">
来源
Translate

您可以在输入中使用。

例如;

<input type=text name="test" autocomplete="off" />
来源