it-swarm.com.de

Chrome ignoriert die automatische Vervollständigung = "Aus".

Ich habe eine Webanwendung erstellt, die eine Dropdown-Liste mit Tagboxen verwendet. Dies funktioniert in allen Browsern außer dem Chrome-Browser (Version 21.0.1180.89).

Obwohl beide input-Felder UND das form-Feld über das autocomplete="off"-Attribut verfügen, besteht Chrome darauf, einen Dropdown-Verlauf der vorherigen Einträge für das Feld anzuzeigen, wodurch die Tagbox-Liste gelöscht wird.

311
Mr Fett

UPDATE

Es scheint jetzt, dass Chrome die Attribute style="display: none;" oder style="visibility: hidden; ignoriert.

Sie können es in etwas ändern:

<input style="opacity: 0;position: absolute;">
<input type="password" style="opacity: 0;position: absolute;">

In meiner Erfahrung vervollständigt Chrome nur den ersten <input type="password"> und den vorherigen <input>. Also habe ich hinzugefügt:

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

Zum Anfang des <form> und der Fall wurde gelöst.

291
Diogo Cid

Automatische Vervollständigung des Benutzernamens (oder der E-Mail-Adresse) und des Kennworts verhindern: 

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

Autocomplete eines Feldes verhindern ( funktioniert möglicherweise nicht ):

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

Erklärung:

autocomplete funktioniert immer noch bei <input>despite mit autocomplete="off", aber Sie können off in einen zufälligen String wie nope ändern.


Andere "solutions" zum Deaktivieren der automatischen Vervollständigung eines Feldes (dies ist nicht der richtige Weg, dies zu tun, aber es funktioniert):

1.

HTML:

<input type="password" id="some_id" autocomplete="new-password">

JS (onload):

(function() {
    var some_id = document.getElementById('some_id');
    some_id.type = 'text';
    some_id.removeAttribute('autocomplete');
})();

oder mit jQuery:

$(document).ready(function() {
    var some_id = $('#some_id');
    some_id.prop('type', 'text');
    some_id.removeAttr('autocomplete');
});

2.

HTML:

<form id="form"></form>

JS (onload):

(function() {
    var input = document.createElement('INPUT');
    input.type = 'text';
    document.getElementById('form').appendChild(input);
})();

oder mit jQuery:

$(document).ready(function() {
    $('<input>', {
        type: 'text'
    }).appendTo($('#form'));
});

So fügen Sie mit jQuery mehrere Felder hinzu:

function addField(label) {
  var div = $('<div>');
  var input = $('<input>', {
    type: 'text'
  });
  
  if(label) {
    var label = $('<label>', {
      text: label
    });
    
    label.append(input);
    div.append(label);    
  } else {
    div.append(input);    
  }  
  
  div.appendTo($('#form'));
}

$(document).ready(function() {
  addField();
  addField('Field 1: ');  
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="form"></form>


Arbeitet in:

  • Chrome: 49+

  • Firefox: 44+

197
Cava

Scheinbar ignoriert Chrome jetzt autocomplete="off", es sei denn, es befindet sich im <form autocomplete="off">-Tag. 

125
ice cream

Für eine zuverlässige Problemumgehung können Sie diesen Code zu Ihrer Layoutseite hinzufügen:

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

Chrome berücksichtigt Autocomplete = off nur, wenn sich im Formular mindestens ein weiteres Eingabeelement mit einem anderen Autocomplete-Wert befindet.

Dies funktioniert nicht mit Kennwortfeldern - diese werden in Chrome sehr unterschiedlich behandelt. Weitere Informationen finden Sie unter https://code.google.com/p/chromium/issues/detail?id=468153 .

UPDATE: Fehler als "Wird nicht behoben" von Chromium Team am 11. März 2016 geschlossen. Siehe den letzten Kommentar in meinen ursprünglich eingereichten Fehlerbericht für eine vollständige Erklärung. TL; DR: Verwenden Sie semantische Autovervollständigungsattribute wie autocomplete = "new-street-address", um zu vermeiden, dass Chrome das automatische Ausfüllen von Dateien durchführt.

64
J.T. Taylor

Moderner Ansatz

Machen Sie einfach Ihre Eingabe readonly und entfernen Sie sie, wenn Sie den Fokus haben. Dies ist ein sehr einfacher Ansatz, und Browser füllen keine readonly-Eingaben auf. Daher wird diese Methode akzeptiert und bei zukünftigen Browser-Updates niemals überschrieben.

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

Der nächste Teil ist optional. Gestalten Sie Ihre Eingabe entsprechend, sodass sie nicht wie eine readonly-Eingabe aussieht.

input[readonly] {
     cursor: text;
     background-color: #fff;
}

ARBEITSBEISPIEL

43
Fizzix

Chrome-Version 34 ignoriert jetzt den autocomplete=off, siehe hierzu .

Viele Diskussionen ob das eine gute oder eine schlechte Sache ist? Was ist deine Meinung?

32
Peter Kerr

Derzeit ist die Lösung die Verwendung von type="search". Google wendet Autofill nicht auf Eingaben mit einer Suchart an.

Siehe: https://Twitter.com/Paul_Kinlan/status/596613148985171968

Update 04.04.2016: Sieht aus, als wäre das behoben! Siehe http://codereview.chromium.org/1473733008

29
Nathan Pitman

Nun, ein bisschen zu spät zur Party, aber es scheint ein bisschen Missverständnis darüber zu geben, wie autocomplete funktionieren sollte und was nicht. Gemäß den HTML-Spezifikationen kann der Benutzeragent (in diesem Fall Chrome) autocomplete überschreiben:

https://www.w3.org/TR/html5/forms.html#autofilling-form-controls:-the-autocomplete-attribute

Ein Benutzeragent kann dem Benutzer gestatten, den Namen des Felds für das automatische Ausfüllen eines Elements zu überschreiben, z. Ändern Sie die Einstellung von "aus" in "ein", damit Werte trotz der Einwände des Seitenautors gespeichert und vorab gefüllt werden können, oder um immer "aus" zu sein und sich niemals an Werte zu erinnern. Benutzerprogramme sollten jedoch nicht zulassen, dass Benutzer den Feldnamen für das automatische Ausfüllen von "aus" bis "ein" oder andere Werte trivial überschreiben, da für den Benutzer erhebliche Sicherheitsauswirkungen bestehen, wenn alle Werte unabhängig von den Voreinstellungen der Site immer gespeichert werden.

Im Falle von Chrome haben die Entwickler im Wesentlichen gesagt: "Wir überlassen es dem Benutzer, in seinen Einstellungen zu entscheiden, ob autocomplete funktionieren soll oder nicht. Wenn Sie dies nicht möchten, aktivieren Sie es nicht in Ihrem Browser ".

Es scheint jedoch, dass dies für meinen Geschmack ein wenig übereifrig ist, aber es ist so, wie es ist. In der Spezifikation werden auch die möglichen Auswirkungen einer solchen Maßnahme auf die Sicherheit diskutiert:

Das Schlüsselwort "off" zeigt entweder an, dass die Eingabedaten der Kontrolle besonders empfindlich sind (beispielsweise der Aktivierungscode für eine Atomwaffe); oder dass es sich dabei um einen Wert handelt, der niemals wiederverwendet wird (z. B. ein Einmalschlüssel für ein Bank-Login), und der Benutzer muss daher die Daten jedes Mal explizit eingeben, anstatt sich auf die UA zum Vorausfüllen verlassen zu können der Wert für ihn; oder dass das Dokument einen eigenen Autocomplete-Mechanismus bereitstellt und nicht möchte, dass der Benutzeragent Autovervollständigungswerte bereitstellt.

Nachdem ich die gleiche Frustration erfahren hatte wie alle anderen, fand ich eine Lösung, die für mich funktioniert. Es ähnelt den autocomplete="false"-Antworten. 

Ein Mozilla-Artikel spricht genau dieses Problem an:

https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion

In einigen Fällen schlägt der Browser weiterhin Autokomplettierungswerte vor, selbst wenn das Autocomplete-Attribut auf off gesetzt ist. Dieses unerwartete Verhalten kann für Entwickler ziemlich rätselhaft sein. Der Trick, um das No-Completion wirklich zu erzwingen, besteht darin, dem Attribut eine zufällige Zeichenfolge zuzuweisen

Also der folgende Code sollte funktionieren:

autocomplete="nope"

Und so sollte jeder der folgenden Punkte:

autocomplete="false"
autocomplete="foo"
autocomplete="bar"

Das Problem, das ich sehe, ist, dass der Browser-Agent möglicherweise klug genug ist, das autocomplete-Attribut zu lernen und es das nächste Mal anzuwenden, wenn es das Formular sieht. Wenn dies der Fall ist, besteht die einzige Möglichkeit, das Problem zu umgehen, darin, den Attributwert autocomplete beim Generieren der Seite dynamisch zu ändern.

Erwähnenswert ist, dass viele Browser autocomplete-Einstellungen für Login-Felder (Benutzername und Passwort) ignorieren. Wie im Mozilla-Artikel heißt es:

Aus diesem Grund unterstützen viele moderne Browser autocomplete = "off" für Anmeldefelder nicht.

  • Wenn eine Site für ein Formular auf autocomplete = "off" setzt und das Eingabefeld Felder für den Benutzernamen und das Kennwort enthält, bietet der Browser an, sich an diese Anmeldung zu erinnern. Wenn der Benutzer dem zustimmt, füllt der Browser diese Felder beim nächsten Mal automatisch aus Benutzer besucht diese Seite.
  • Wenn für eine Site autocomplete = "off" für die Eingabefelder für Benutzername und Kennwort festgelegt ist, bietet der Browser an, sich an diese Anmeldung zu erinnern. Wenn der Benutzer dem zustimmt, füllt der Browser diese Felder beim nächsten Besuch dieser Seite automatisch aus.

Dies ist das Verhalten in Firefox (seit Version 38), Google Chrome (seit 34) und Internet Explorer (seit Version 11).

Zum Schluss noch ein paar Informationen dazu, ob das Attribut zum form-Element oder zum input-Element gehört. Die Spezifikation hat wieder die Antwort:

Wenn das Autocomplete-Attribut weggelassen wird, wird stattdessen der Standardwert verwendet, der dem Status des Autocomplete-Attributs des Formulareigentümers entspricht (entweder "on" oder "off"). Wenn kein Formularbesitzer vorhanden ist, wird der Wert "Ein" verwendet.

So. Das Einfügen in das Formular sollte für alle Eingabefelder gelten. Wenn Sie es auf ein einzelnes Element setzen, sollte es nur für dieses Element gelten (auch wenn es im Formular kein Element gibt). Wenn autocomplete nicht festgelegt ist, wird standardmäßig on verwendet.

Zusammenfassung

So deaktivieren Sie autocomplete für das gesamte Formular:

<form autocomplete="off" ...>

Oder wenn Sie es dynamisch benötigen:

<form autocomplete="random-string" ...>

So deaktivieren Sie autocomplete für ein einzelnes Element (unabhängig davon, ob die Formulareinstellung vorhanden ist oder nicht)

<input autocomplete="off" ...>

Oder wenn Sie es dynamisch benötigen:

<input autocomplete="random-string" ...>

Denken Sie daran, dass bestimmte Benutzeragenten auch Ihre hart umkämpften Versuche zum Deaktivieren von autocomplete außer Kraft setzen können.

29
Hooligancat

Browser kümmert sich nicht um Autocomplete = Off Auto oder füllt sogar Anmeldeinformationen zu falschen Textfeld?

Ich habe das Problem behoben, indem ich das Kennwortfeld auf "Nur Lesen" gesetzt und aktiviert habe, wenn der Benutzer darauf klickt oder die Tabulatortaste für dieses Feld verwendet.

Das automatische Ausfüllen des Browsers in: readonly korrigieren und Writeble auf Fokus setzen (per Mausklick und Tabulatur durch die Felder)

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

Update: Mobile Safari setzt den Cursor in das Feld, zeigt jedoch keine virtuelle Tastatur an. New Fix funktioniert wie zuvor, verwaltet jedoch die virtuelle Tastatur:

<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();  }" />

Live Demo https://jsfiddle.net/danielsuess/n0scguv6/

// UpdateEnd

Übrigens mehr Infos zu meiner Beobachtung:

Manchmal bemerke ich dieses seltsame Verhalten bei Chrome und Safari, wenn es Passwortfelder in gleicher Form gibt. Ich schätze, der Browser sucht nach einem Passwortfeld um Geben Sie Ihre gespeicherten Anmeldeinformationen ein. Dann füllt es sich automatisch Benutzername in das nächste textähnliche Eingabefeld, das vor dem Passwortfeld in DOM erscheint (nur Vermutung) wegen Beobachtung). Da der Browser die letzte Instanz ist und Sie ihn nicht steuern können, würde manchmal sogar Autocomplete = off nicht verhindern, Anmeldeinformationen einzugeben in falsche Felder, aber nicht in Benutzer- oder Spitznamenfelder.

24
dsuess

Sie können autocomplete="new-password" verwenden

<input type="email" name="email">
<input type="password" name="password" autocomplete="new-password">

Arbeitet in:

  • Chrome: 53, 54, 55
  • Firefox: 48, 49, 50
18
Steffi

für jeden, der nach einer Lösung sucht, finde ich es endlich heraus. 

Chrome befolgt nur die automatische Vervollständigung = "aus", wenn die Seite eine HTML5-Seite ist (ich habe XHTML verwendet).

Ich habe meine Seite in HTML5 konvertiert und das Problem ist verschwunden (facepalm).

8
Mr Fett

Da Chrome den autocomplete="off" ignoriert hat, löse ich es auf eine dumme Weise, bei der "falsche Eingabe" verwendet wird, um Chrom zu betrügen, um ihn zu füllen, anstatt den "echten" zu füllen.

Beispiel:

<input type="text" name="username" style="display:none" value="fake input" /> 
<input type="text" name="username" value="real input"/>

Chrome füllt die "falsche Eingabe" auf und der Server nimmt beim Senden den Wert für "echte Eingabe" an.

8
Chang

Ich poste diese Antwort, um eine aktualisierte Lösung für dieses Problem zu bringen ... Ich benutze zurzeit Chrome 49 und für dieses Problem ist keine Antwort möglich .. Ich suche auch nach einer Lösung, die mit anderen Browsern und früheren Versionen funktioniert.

Setzen Sie diesen Code am Anfang Ihres Formulars

<div style="display: none;">
    <input type="text" autocomplete="new-password">
    <input type="password" autocomplete="new-password">
</div>

Verwenden Sie dann für Ihr echtes Passwortfeld

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

Kommentieren Sie diese Antwort, wenn dies nicht mehr funktioniert oder wenn ein Problem mit einem anderen Browser oder einer anderen Version auftritt.

Genehmigt am:

  • Chrome: 49
  • Firefox: 44, 45
  • Kante: 25
  • Internet Explorer: 11
7
Loenix

Bis zu dieser letzten Woche schienen die beiden folgenden Lösungen für Chrome, IE und Firefox, zu funktionieren. Mit der Veröffentlichung von Chrome Version 48 (und noch in 49) funktionieren sie jedoch nicht mehr:

  1. Das Folgende am oberen Rand des Formulars: 
<input style="display:none" type="text" name="fakeUsername"/>
<input style="display:none" type="password" name="fakePassword"/>
  1. Folgendes im Kennworteingabeelement:

    autovervollständigen = "Aus"

Um dies schnell zu beheben, habe ich zunächst versucht, das Passworteingabeelement zunächst auf "disabled" zu setzen und dann in der document ready-Funktion setTimeout erneut zu aktivieren. 

setTimeout(function(){$('#PasswordData').prop('disabled', false);}, 50);

Aber das schien so verrückt zu sein, und ich suchte weiter und fand @tibalts Antwort in Deaktivieren von Chrome-Autofill . Seine Antwort ist die Verwendung von autocomplete = "new-password" in der Eingabe von Passwörtern. Dies scheint auf allen Browsern zu funktionieren (ich habe meine Fix-Nummer 1 oben beibehalten).

Hier ist der Link in der Google Chrome-Entwicklerdiskussion: https://code.google.com/p/chromium/issues/detail?id=370363#c7

6
prajna

Anstelle von autocomplete = "off" verwenden Sie autocomplete = "false";).

von: https://stackoverflow.com/a/29582380/75799

5
Basit

autocomplete=off wird in modernen Browsern weitgehend ignoriert - hauptsächlich aufgrund von Passwortmanagern usw.

Sie können versuchen, diesen autocomplete="new-password" hinzuzufügen, er wird nicht von allen Browsern vollständig unterstützt, funktioniert aber bei einigen

5
Mahdi Afzal

Ab Chrome 42 funktioniert keine der Lösungen/Hacks in diesem Thread (ab 2015-05-21T12:50:23+00:00) zum Deaktivieren der automatischen Vervollständigung für ein einzelnes Feld oder das gesamte Formular. 

EDIT: Ich habe festgestellt, dass Sie eigentlich nur ein Dummy-E-Mail-Feld in Ihr Formular einfügen müssen (Sie können es mit display: none ausblenden) vor den anderen Feldern, um die automatische Vervollständigung zu verhindern. Ich gehe davon aus, dass Chrome in jedem automatisch vervollständigten Feld eine Art Formularsignatur speichert. Durch das Hinzufügen eines weiteren E-Mail-Felds wird diese Signatur beschädigt und die automatische Vervollständigung verhindert.

<form action="/login" method="post">
    <input type="email" name="fake_email" style="display:none" aria-hidden="true">
    <input type="email" name="email">
    <input type="password" name="password">
    <input type="submit">
</form>

Die gute Nachricht ist, dass, da die "Formularsignatur" dadurch beschädigt wird, keines der Felder automatisch ausgefüllt wird. Daher ist kein JS erforderlich, um die gefälschten Felder vor dem Senden zu löschen.

Alte Antwort:

Das einzige, was ich noch als praktikabel erwiesen habe, ist, zwei Dummy-Felder vom Typ E-Mail und Passwort vor den eigentlichen Feldern einzufügen. Sie können sie auf display: none setzen, um sie auszublenden (es ist nicht klug genug, diese Felder zu ignorieren):

<form action="/login" method="post">
    <input type="email" name="fake_email" style="display:none" aria-hidden="true">
    <input type="password" name="fake_password" style="display:none" aria-hidden="true">
    <input type="email" name="email">
    <input type="password" name="password">
    <input type="submit">
</form>

Leider müssen sich die Felder in Ihrem Formular befinden (andernfalls werden beide Eingabesätze automatisch ausgefüllt). Damit die gefälschten Felder wirklich ignoriert werden, benötigen Sie einige JS, die auf Formularsendung ausgeführt werden, um sie zu löschen:

form.addEventListener('submit', function() {
    form.elements['fake_email'].value = '';
    form.elements['fake_password'].value = '';
});

Beachten Sie von oben, dass das Löschen des Werts mit Javascript die automatische Vervollständigung außer Kraft setzt. Wenn es also akzeptabel ist, das richtige Verhalten bei deaktiviertem JS zu verlieren, können Sie dies alles mit einem "Polyfill" von JS für Chrome vereinfachen:

(function(document) {

    function polyfillAutocomplete(nodes) {

        for(var i = 0, length = nodes.length; i < length; i++) {

            if(nodes[i].getAttribute('autocomplete') === 'off') {

                nodes[i].value = '';
            }
        }
    }

    setTimeout(function() {

        polyfillAutocomplete(document.getElementsByTagName('input'));
        polyfillAutocomplete(document.getElementsByTagName('textarea'));

    }, 1);

})(window.document);
4
Bailey Parker

Autocomplete="Off" funktioniert nicht mehr. 

Verwenden Sie statt "Off" nur eine zufällige Zeichenfolge, beispielsweise Autocomplete="NoAutocomplete".

Ich hoffe, es hilft.

3
marco burrometo

Ich habe den endlosen Kampf mit Google Chrome mit zufälligen Zeichen gelöst.

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

Hoffe, dass es anderen Menschen helfen wird.

3
step

Nach dem Chrome v. 34 funktioniert die Einstellung von autocomplete="off" am <form>-Tag nicht

Ich habe die Änderungen vorgenommen, um dieses lästige Verhalten zu vermeiden:

  1. Entfernen Sie die name und die id der Passworteingabe
  2. Fügen Sie eine Klasse in die Eingabe ein (Beispiel: passwordInput)

(Bisher hat Chrome das gespeicherte Kennwort nicht für die Eingabe verwendet, aber das Formular ist jetzt defekt.)

Um das Formular zum Laufen zu bringen, sollten Sie diesen Code ausführen, wenn der Benutzer auf die Schaltfläche "Abschicken" klickt oder wann immer Sie die Formularübergabe auslösen möchten:

var sI = $(".passwordInput")[0];
$(sI).attr("id", "password");
$(sI).attr("name", "password");

In meinem Fall habe ich id="password" name="password" in der Passworteingabe verwendet, also setze ich sie zurück, bevor die Submition ausgelöst wird.

3
Renato Lochetti

Ich habe gerade auf Chrome 49 und Diogo Cids Lösung aktualisiert funktioniert nicht mehr.

Ich habe eine andere Problemumgehung vorgenommen, um die Felder nach dem Laden der Seite zur Laufzeit auszublenden und zu entfernen.

Chrome ignoriert nun die ursprüngliche Problemumgehung, indem die Anmeldeinformationen auf das erste angezeigttype="password"-Feld und das vorherige type="text"-Feld angewendet werden. Daher habe ich beide Felder mit CSSvisibility: hidden; ausgeblendet.

<!-- HTML -->
<form>
    <!-- Fake fields -->
    <input class="chromeHack-autocomplete">
    <input type="password" class="chromeHack-autocomplete">

    <input type="text" placeholder="e-mail" autocomplete="off" />
    <input type="password" placeholder="Password" autocomplete="off" />
</form>

<!-- CSS -->
.chromeHack-autocomplete {
    height: 0px !important;
    width: 0px !important;
    opacity: 0 !important;
    padding: 0 !important; margin: 0 !important;
}

<!--JavaScript (jQuery) -->
jQuery(window).load(function() {
    $(".chromeHack-autocomplete").delay(100).hide(0, function() {
        $(this).remove();
    });
});

Ich weiß, dass es vielleicht nicht sehr elegant wirkt, aber es funktioniert.

3
Cliff Burton

Verwenden Sie in Chrome 48+ diese Lösung:

  1. Setzen Sie falsche Felder vor realen Feldern:

    <form autocomplete="off">
      <input name="fake_email"    class="visually-hidden" type="text">
      <input name="fake_password" class="visually-hidden" type="password">
    
      <input autocomplete="off" name="email"    type="text">
      <input autocomplete="off" name="password" type="password">
    </form>
    
  2. Falsche Felder ausblenden:

    .visually-hidden {
      margin: -1px;
      padding: 0;
      width: 1px;
      height: 1px;
      overflow: hidden;
      clip: rect(0 0 0 0);
      clip: rect(0, 0, 0, 0);
      position: absolute;
    }
    
  3. Du hast es geschafft!

Das funktioniert auch bei älteren Versionen.

3
yivo

Nachdem Sie alle Lösungen ausprobiert haben, scheint Folgendes für die Chrome-Version 45 zu funktionieren, wobei das Formular das Kennwortfeld enthält:

 jQuery('document').ready(function(){
        //For disabling Chrome Autocomplete
        jQuery( ":text" ).attr('autocomplete','pre'+Math.random(0,100000000));
 });
3
anshuman

autocomplete="off" funktioniert jetzt, also können Sie einfach Folgendes tun:

<input id="firstName2" name="firstName2" autocomplete="off">

Getestet im aktuellen Chrome 70 sowie in allen Versionen ab Chrome 62.

Demo .

UPDATE: Da die Leute dazu neigen, dies abzustimmen (siehe beispielsweise einen Kommentar von @AntonKuznetsov down), bevor Sie die Demonstration im JSFiddle lesen oder tatsächlich in den HTML-Code des JSFiddle schauen, muss ich dies tun drück es klar aus:

  • die oberste Variable input funktioniert automatisch
  • the bottominput hat die automatische Vervollständigung deaktiviert durch Hinzufügen von autocomplete="off"
3

Ändern Sie das Eingabetypattribut in type="search"

Google wendet das automatische Ausfüllen nicht auf Eingaben mit einer Suchart an.

3

ich fand diese Lösung am besten geeignet: 

function clearChromeAutocomplete()
{
// not possible, let's try: 
if (navigator.userAgent.toLowerCase().indexOf('chrome') >= 0) 
{
document.getElementById('adminForm').setAttribute('autocomplete', 'off'); 
setTimeout(function () {
        document.getElementById('adminForm').setAttribute('autocomplete', 'on'); 
}, 1500);
}
}

Es muss nach dom ready oder nach dem Rendern des Formulars geladen werden. 

2
user2241415

Ich bin zwar der Meinung, dass die automatische Vervollständigung eine Benutzerauswahl sein sollte, aber es gibt Zeiten, in denen Chrome zu eifrig ist (andere Browser möglicherweise auch). Beispielsweise wird ein Kennwortfeld mit einem anderen Namen immer noch automatisch mit einem gespeicherten Kennwort gefüllt und das vorherige Feld wird mit dem Benutzernamen aufgefüllt. Dies ist insbesondere dann ein Nachteil, wenn das Formular ein Benutzerverwaltungsformular für eine Webanwendung ist und Sie nicht möchten, dass das automatische Ausfüllen es mit Ihren eigenen Anmeldeinformationen füllt.

Autocomplete = "off" wird von Chrome jetzt vollständig ignoriert. Während die JS-Hacks vielleicht funktionieren, habe ich einen einfachen Weg gefunden, der zum Zeitpunkt des Schreibens funktioniert:

Setzen Sie den Wert des Kennwortfelds auf das Steuerzeichen 8 ("\x08" in PHP oder &#8; in HTML). Dadurch wird das automatische Ausfüllen des Felds in Chrome angehalten, da es einen Wert enthält. Es wird jedoch kein tatsächlicher Wert eingegeben, da dies das Rückschrittzeichen ist.

Ja, das ist immer noch ein Hack, aber es funktioniert für mich. YMMV.

2
spikyjt

Ich habe auf andere Weise gelöst. Sie können es versuchen.

<input id="passfld" type="text" autocomplete="off" />
<script type="text/javascript">
// Using jQuery
$(function(){                                               
    setTimeout(function(){
        $("input#passfld").attr("type","password");
    },10);
});


// or in pure javascript
 window.onload=function(){                                              
    setTimeout(function(){  
        document.getElementById('passfld').type = 'password';
    },10);
  }   
</script>
2
SarwarCSE

Ich hatte ein ähnliches Problem, bei dem das Eingabefeld entweder einen Namen oder eine E-Mail enthielt. Ich habe autocomplete = "off" gesetzt, aber Chrome hat trotzdem Vorschläge erzwungen. Es stellte sich heraus, dass der Platzhaltertext die Wörter "Name" und "E-Mail" enthielt.

Zum Beispiel

<input type="text" placeholder="name or email" autocomplete="off" />

Ich bin darum herumgekommen, indem ich ein Leerzeichen in die Wörter im Platzhalter eingefügt habe. Keine Chrome-Autovervollständigung mehr.

<input type="text" placeholder="nam&#8203;e or emai&#8203;l" autocomplete="off" />
1
WDuffy

autocomplete="off" arbeitet normalerweise, aber nicht immer. Dies hängt von der name des Eingabefeldes ab. Namen wie "Adresse", "E-Mail", "Name" - werden automatisch ausgefüllt (Browser glauben, dass sie Benutzern helfen), wenn Felder wie "Code", "Pin" - nicht automatisch ausgefüllt werden (wenn autocomplete="off" eingestellt ist)

Mein Problem war - Autocomplete hat mit google address helper durcheinander gebracht

Ich habe es durch Umbenennen behoben 

von 

<input type="text" name="address" autocomplete="off">

zu

<input type="text" name="the_address" autocomplete="off">

Getestet in Chrom 71.

1

Wenn Sie ein Widget wie jQuery UI verwenden, stellen Sie sicher, dass die Option Autocomplete nicht zum Autocomplete-Attribut hinzugefügt/geändert wird. Ich habe festgestellt, dass dies wahr ist, wenn ich es verwende, und werde jegliche Arbeit unterbrechen, die Sie möglicherweise gemacht haben, um das Zwischenspeichern von Browserfeldern außer Kraft zu setzen. Stellen Sie sicher, dass Sie ein eindeutiges Namensattribut haben, und erzwingen Sie ein eindeutiges Autocomplete-Attribut, nachdem das Widget initialisiert wurde. Nachfolgend finden Sie einige Hinweise, wie dies in Ihrer Situation funktionieren kann.

<?php $autocomplete = 'off_'.time(); ?>
<script>
   $('#email').autocomplete({
      create: function( event, ui ) {
         $(this).attr('autocomplete','<? echo $autocomplete; ?>');
      },
      source: function (request, response) { //your code here },
      focus: function( event, ui ) { //your code here },
      select: function( event, ui ) { //your code here },
   });
</script>
<input type="email" id="email" name="email_<? echo $autocomplete; ?>" autocomplete="<? echo $autocomplete; ?>" />
1
SurferJoe

Der verborgene Eingabeelement-Trick scheint immer noch zu funktionieren (Chrome 43), um das automatische Ausfüllen von Dateien zu verhindern. Es ist jedoch zu beachten, dass Chrome versucht, anhand des Platzhaltertags automatisch zu füllen. Sie müssen den Platzhalter des ausgeblendeten Eingabeelements an den Eintrag anpassen, den Sie deaktivieren möchten.

In meinem Fall hatte ich ein Feld mit einem Platzhaltertext "Stadt oder PLZ", das ich mit Google Place Autocomplete verwendet habe. Es schien, dass es versuchte, automatisch zu füllen, als ob es Teil eines Adressformulars wäre. Der Trick hat nicht funktioniert, bis ich den gleichen Platzhalter auf das verborgene Element gesetzt habe wie auf die echte Eingabe:

<input style="display:none;" type="text" placeholder="City or Zip" />
<input autocomplete="off" type="text" placeholder="City or Zip" />
1
Sam

Sieht aus, als wäre dies behoben! Siehe https://codereview.chromium.org/1473733008

1
Nathan Pitman

Ich benutze Chrome - Version 64.0.3282.140 (Official Build) (64-Bit) und habe folgenden Code zusammen mit dem Formularnamen verwendet und es funktioniert für mich.

<form name="formNameHere">....</form>
<script type="text/javascript">
    setTimeout(function(){
        document.formNameHere.reset();
    },500);
</script>
0
Nishant

Keine der Lösungen funktionierte, es sei denn, sie fälschten die automatische Vervollständigung. Ich habe eine React-Komponente erstellt, um dieses Problem zu beheben.

import React from 'react'

// Google Chrome stubbornly refuses to respect the autocomplete="off" HTML attribute so
// we have to give it a "fake" field for it to autocomplete that never gets "used".

const DontBeEvil = () => (
  <div style={{ display: 'none' }}>
    <input type="text" name="username" />
    <input type="password" name="password" />
  </div>
)

export default DontBeEvil
0
Brennan Cheung

Keine Ahnung, warum dies in meinem Fall funktioniert hat, aber bei Chrome habe ich autocomplete = "none" verwendet und Chrome hat keine Adressen mehr für mein Textfeld vorgeschlagen.

0
Chris Sprague

Für dieses Problem habe ich diese CSS-Lösung verwendet. Es arbeitet für mich.

input{
  text-security:disc !important;
  -webkit-text-security:disc !important;
  -moz-text-security:disc !important;
}
0
gem007bd

Fügen Sie dieses direkt nach dem Form-Tag hinzu:

<form>
<div class="div-form">
<input type="text">
<input type="password" >
</div>

Fügen Sie dies Ihrer CSS-Datei hinzu:

.div-form{
opacity: 0;
}
0
ITinARRAY

AutoComplete = 'false' muss verwendet werden, was auch für den Chrome-Browser und den verwendeten Code funktioniert 

<ng-form autocomplete="false"> 
.....
</ng-form>
0
SantoshK

Um die automatische Vervollständigung zu verhindern, legen Sie einfach einen leeren Bereich als Eingabewert fest:

<input type="text" name="name" value="  ">
0
JVitela

Folgendes funktionierte für mich in Chrome Version 51.0.2704.106 .<input id="user_name" type="text" name="user_name" autocomplete="off" required /> und in Kombination mit <input id="user_password" type="password" name="user_password" autocomplete="new-password" required />. Mein Problem war, dass nach der Implementierung von new-password immer noch ein Dropdown von Benutzernamen im Feld user_name angezeigt wird.

0
hyperj123

Ich habe gerade Folgendes ausprobiert und scheint den Trick auf Chrome 53 auszuführen - es deaktiviert außerdem die Dropdown-Liste "Kennwort verwenden für", wenn das Kennwortfeld eingegeben wird.

Setzen Sie den Kennworteingabetyp einfach auf text und fügen Sie dann den Handler onfocus hinzu (Inline oder über jQuery/Vanilla JS), um den Typ auf password zu setzen:

onfocus="this.setAttribute('type','password')"

Oder noch besser:

onfocus="if(this.getAttribute('type')==='text') this.setAttribute('type','password')"
0
Mike Rockétt

Ich nenne das den Vorschlaghammer-Ansatz, aber es scheint für mich zu funktionieren, wo alle anderen Ansätze, die ich versucht habe, fehlgeschlagen sind:

<input autocomplete="off" data-autocomplete-ninja="true" name="fa" id="fa" />

Hinweis: Die Attribute für Eingabename und -ID dürfen nichts enthalten, das dem Browser einen Hinweis auf die Daten gibt. Andernfalls funktioniert diese Lösung nicht. Zum Beispiel verwende ich "fa" anstelle von "FullAddress".

Und das folgende Skript beim Laden der Seite (dieses Skript verwendet JQuery):

$("[data-autocomplete-ninja]").each(function () {
    $(this).focus(function () {
        $(this).data("ninja-name", $(this).attr("name")).attr("name", "");
    }).blur(function () {
        $(this).attr("name", $(this).data("ninja-name"));
    });
});

Die obige Lösung sollte verhindern, dass der Browser Daten, die von anderen Formularen oder von früheren Einsendungen in demselben Formular erfasst wurden, automatisch ausfüllt.

Grundsätzlich entferne ich das Namensattribut, während die Eingabe im Fokus ist. Solange Sie nichts tun, während das Element im Fokus ist, das Attribut name erforderlich ist, z. B. Selektoren nach Elementnamen verwenden, sollte diese Lösung harmlos sein.

0
jonh

TL; DR: Sagen Sie Chrome, dass dies eine neue Passworteingabe ist und keine alten als Vorschläge für die automatische Vervollständigung verwendet werden:

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

autocomplete="off" funktioniert aufgrund einer Entwurfsentscheidung nicht - viele Untersuchungen haben gezeigt, dass Benutzer viel länger und schwieriger Passwörter hacken müssen, wenn sie sie in einem Browser oder einem Passwortmanager speichern können.

Die Spezifikation für autocompletehat sich geändert und unterstützt jetzt verschiedene Werte, damit Anmeldeformulare leicht automatisch ausgefüllt werden können:

<!-- Auto fills with the username for the site, even though it's email format -->
<input type="email" name="email" autocomplete="username">

<!-- current-password will populate for the matched username input  -->
<input type="password" autocomplete="current-password" />

Wenn Sie nicht angeben, versucht Chrome immer noch zu raten, und wenn dies der Fall ist, ignoriert es autocomplete="off".

Die Lösung besteht darin, dass für Variablen zum Zurücksetzen von Kennwörtern auch autocomplete-Werte vorhanden sind:

<label>Enter your old password:
    <input type="password" autocomplete="current-password" name="pass-old" />
</label>
<label>Enter your new password:
    <input type="password" autocomplete="new-password" name="pass-new" />
</label>
<label>Please repeat it to be sure:
    <input type="password" autocomplete="new-password" name="pass-repeat" />
</label>

Sie können dieses autocomplete="new-password"-Flag verwenden, um Chrome anzuweisen, das Passwort nicht zu erraten, auch wenn für diese Site ein Kennwort gespeichert ist.

Chrome kann Kennwörter für Sites auch direkt mithilfe der API " credentials" verwalten, die ein Standard ist und möglicherweise universell unterstützt wird.

0
Keith