Ich bin auf verschiedenen Formularen auf Probleme mit dem Verhalten beim automatischen Ausfüllen von Chrom gestoßen.

Die Felder im Formular haben alle sehr gebräuchliche und genaue Namen wie "E-Mail", "Name" oder "Passwort" und sie haben auch autocomplete="off"festgelegt.

Das Flag für die automatische Vervollständigung hat das Verhalten bei der automatischen Vervollständigung erfolgreich deaktiviert. Wenn Sie mit der Eingabe beginnen, wird eine Dropdown-Liste mit Werten angezeigt. Die Werte, mit denen Chrome die Felder automatisch ausfüllt, wurden jedoch nicht geändert.

Dieses Verhalten wäre in Ordnung, außer dass Chrome die Eingaben falsch füllt, z. B. die Telefoneingabe mit einer E-Mail-Adresse. Kunden haben sich darüber beschwert, daher wurde überprüft, dass dies in mehreren Fällen geschieht und nicht als Ergebnis von etwas, das ich lokal auf meinem Computer ausgeführt habe.

Die einzige aktuelle Lösung, die ich mir vorstellen kann, besteht darin, dynamisch benutzerdefinierte Eingabenamen zu generieren und dann die Werte im Backend zu extrahieren. Dies scheint jedoch ein ziemlich hackiger Weg zu sein, um dieses Problem zu umgehen. Gibt es Tags oder Macken, die das Verhalten beim automatischen Ausfüllen ändern und zur Behebung dieses Problems verwendet werden können?

Für neue Chrome-Versionen können Sie einfach autocomplete="new-password"Ihr Passwortfeld eingeben und fertig. Ich habe es überprüft, funktioniert gut.

Ich habe diesen Tipp vom Chrome-Entwickler in dieser Diskussion erhalten: https://bugs.chromium.org/p/chromium/issues/detail?id=370363#c7

PS Beachten Sie, dass Chrome versucht, das Verhalten beim automatischen Ausfüllen aus Name, ID und jeglichem Textinhalt abzuleiten, der das Feld umgibt, einschließlich Beschriftungen und beliebiger Textknoten. Wenn es ein Token für die automatische Vervollständigung wie street-addressim Kontext gibt, füllt Chrome dieses automatisch als solches aus. Die Heuristik kann ziemlich verwirrend sein, da sie manchmal nur ausgelöst wird, wenn das Formular zusätzliche Felder enthält oder nicht, wenn das Formular zu wenige Felder enthält. Beachten Sie auch, dass dies autocomplete="no"anscheinend funktioniert, autocomplete="off"jedoch aus historischen Gründen nicht. autocomplete="no"genannt ist , dass Sie den Browser zu sagen , dass dieses Feld automatisch als Feld abgeschlossen sein sollte "no". Wenn Sie eindeutige Zufallsnamen generieren autocomplete, deaktivieren Sie die automatische Vervollständigung.

Wenn Ihre Benutzer schlechte Formen ihre autofill besucht haben Informationen können korrupt . Es kann eine notwendige Maßnahme sein, wenn sie ihre Informationen zum automatischen Ausfüllen in Chrome manuell eingeben und korrigieren.

Ich habe gerade festgestellt, dass die aktuelle Version von Chrome Ihren Benutzernamen / Ihre E-Mail-Adresse vor jedem type=passwordFeld automatisch in das Feld ausfüllt, wenn Sie einen gespeicherten Benutzernamen und ein Kennwort für eine Site haben . Es ist egal, wie das Feld heißt - es wird nur das Feld angenommen, bevor das Passwort Ihr Benutzername sein wird.

Alte Lösung

Verwenden Sie <form autocomplete="off">es einfach und es verhindert das Vorfüllen von Passwörtern sowie jede Art von heuristischem Ausfüllen von Feldern basierend auf Annahmen, die ein Browser treffen kann (die oft falsch sind). Im Gegensatz zu einer Verwendung, <input autocomplete="off">die vom automatischen Ausfüllen des Kennworts so gut wie ignoriert zu werden scheint (in Chrome befolgt Firefox dies jedoch).

Aktualisierte Lösung

Chrome ignoriert jetzt <form autocomplete="off"> . Daher ist meine ursprüngliche Problemumgehung (die ich gelöscht hatte) jetzt der letzte Schrei.

Erstellen Sie einfach ein paar Felder und machen Sie sie mit "display: none" ausgeblendet. Beispiel:

<!-- fake fields are a workaround for chrome autofill getting the wrong fields -->
<input style="display:none" type="text" name="fakeusernameremembered"/>
<input style="display:none" type="password" name="fakepasswordremembered"/>

Dann legen Sie Ihre realen Felder darunter.

Denken Sie daran, den Kommentar hinzuzufügen, da sich andere Personen in Ihrem Team fragen, was Sie tun!

Update März 2016

Gerade mit dem neuesten Chrome getestet - alles gut. Dies ist jetzt eine ziemlich alte Antwort, aber ich möchte nur erwähnen, dass unser Team sie seit Jahren für Dutzende von Projekten verwendet. Es funktioniert trotz einiger Kommentare unten immer noch großartig. Es gibt keine Probleme mit der Barrierefreiheit, da die Felder display:nonebedeuten, dass sie nicht fokussiert werden. Wie ich bereits erwähnt habe, müssen Sie sie vorher setzen Ihre realen Felder stellen.

Wenn Sie Javascript verwenden, um Ihr Formular zu ändern, benötigen Sie einen zusätzlichen Trick. Zeigen Sie die gefälschten Felder an, während Sie das Formular bearbeiten, und blenden Sie sie eine Millisekunde später wieder aus.

Beispielcode mit jQuery (vorausgesetzt, Sie geben Ihren gefälschten Feldern eine Klasse):

        $(".fake-autofill-fields").show();
        // some DOM manipulation/ajax here
        window.setTimeout(function () {
            $(".fake-autofill-fields").hide();
        },1);

Update Juli 2018

Meine Lösung funktioniert nicht mehr so ​​gut, da die Anti-Usability-Experten von Chrome hart gearbeitet haben. Aber sie haben uns einen Knochen geworfen in Form von:

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

Dies funktioniert und löst meistens das Problem.

Es funktioniert jedoch nicht, wenn Sie kein Kennwortfeld, sondern nur eine E-Mail-Adresse haben. Das kann auch schwierig sein, damit es nicht mehr gelb wird und vorfüllt. Die Lösung für gefälschte Felder kann verwendet werden, um dies zu beheben.

Tatsächlich müssen Sie manchmal zwei gefälschte Felder ablegen und sie an verschiedenen Orten ausprobieren. Zum Beispiel hatte ich bereits zu Beginn meines Formulars gefälschte Felder, aber Chrome hat kürzlich wieder damit begonnen, mein Feld "E-Mail" vorab auszufüllen. Dann habe ich mich verdoppelt und kurz vor dem Feld "E-Mail" weitere gefälschte Felder eingefügt, und das hat das Problem behoben . Wenn Sie entweder das erste oder das zweite Los der Felder entfernen, wird das falsche übereifrige automatische Ausfüllen wiederhergestellt.

Update März 2020

Es ist nicht klar, ob und wann diese Lösung noch funktioniert. Es scheint manchmal immer noch zu funktionieren, aber nicht immer.

In den Kommentaren unten finden Sie einige Hinweise. Eine, die gerade von @anilyeni hinzugefügt wurde, ist möglicherweise eine weitere Untersuchung wert:

Wie ich bemerkt habe, autocomplete="off"funktioniert auf Chrome 80, wenn weniger als 3 Elemente enthalten sind <form>. Ich weiß nicht, was die Logik ist oder wo die zugehörige Dokumentation darüber.

Auch dieser von @dubrox kann relevant sein, obwohl ich ihn nicht getestet habe:

Vielen Dank für den Trick, aber bitte aktualisieren Sie die Antwort, da display:none;es nicht mehr funktioniert, aber position: fixed;top:-100px;left:-100px; width:5px;funktioniert :)

Update APRIL 2020

Ein besonderer Wert für Chrome für dieses Attribut ist die Ausführung der Aufgabe: (bei Eingabe getestet - aber nicht von mir) autocomplete="chrome-off"

Nach Monaten und Monaten des Kampfes habe ich festgestellt, dass die Lösung viel einfacher ist, als Sie sich vorstellen können:

Anstelle von autocomplete="off"Gebrauchautocomplete="false" ;)

So einfach ist das und es funktioniert auch in Google Chrome wie ein Zauber!

Update August 2019 (Gutschrift an @JonEdiger in Kommentaren)

Hinweis: Viele Online-Informationen besagen, dass die Browser jetzt Autocomplete = 'false' als identisch mit Autocomplete = 'off' behandeln. Zumindest ab dieser Minute wird die automatische Vervollständigung für diese drei Browser verhindert.

Stellen Sie es auf Formularebene ein und setzen Sie dann für die Eingaben, die Sie deaktivieren möchten, einen ungültigen Wert wie 'none':

<form autocomplete="off"> 
  <input type="text" id="lastName" autocomplete="none"/> 
  <input type="text" id="firstName" autocomplete="none"/>
</form>

Manchmal wird sogar autocomplete=offdas Ausfüllen von Anmeldeinformationen in falsche Felder nicht verhindert.

Eine Problemumgehung besteht darin, das automatische Ausfüllen des Browsers im Readonly-Modus zu deaktivieren und die Beschreibbarkeit auf den Fokus zu setzen:

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

Das focusEreignis tritt bei Mausklicks und beim Durchblättern von Feldern auf.

Aktualisieren:

Mobile Safari setzt den Cursor in das Feld, zeigt jedoch keine virtuelle Tastatur an. Diese neue Problemumgehung funktioniert wie zuvor, behandelt 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

Erläuterung: Der Browser füllt die Anmeldeinformationen automatisch in ein falsches Textfeld.

Füllen Sie die Eingaben falsch aus, z. B. indem Sie die Telefoneingabe mit einer E-Mail-Adresse füllen

Manchmal bemerke ich dieses seltsame Verhalten in Chrome und Safari, wenn Kennwortfelder in derselben Form vorhanden sind. Ich denke, der Browser sucht nach einem Passwortfeld, um Ihre gespeicherten Anmeldeinformationen einzufügen. Anschließend wird der Benutzername automatisch in das nächste textähnliche Eingabefeld ausgefüllt, das vor dem Kennwortfeld im DOM angezeigt wird (nur aufgrund von Beobachtungen erraten). Da der Browser die letzte Instanz ist und Sie sie nicht steuern können,

Dieser Readonly-Fix ​​oben hat bei mir funktioniert.

Wenn Sie eine Suchfeldfunktion implementieren, versuchen Sie, das typeAttribut searchwie folgt festzulegen:

<input type="search" autocomplete="off" />

Dies funktioniert für mich unter Chrome v48 und scheint ein legitimes Markup zu sein:

https://www.w3.org/wiki/HTML/Elements/input/search

Versuche dies. Ich weiß, dass die Frage etwas alt ist, aber dies ist ein anderer Ansatz für das Problem.

Mir ist auch aufgefallen, dass das Problem knapp über dem liegt password Feld liegt.

Ich habe beide Methoden ausprobiert

<form autocomplete="off"> und <input autocomplete="off"> aber keiner von ihnen arbeitete für mich.

Also habe ich es mit dem folgenden Snippet behoben - habe einfach ein weiteres Textfeld direkt über dem Feld für den Kennworttyp hinzugefügt und es erstellt display:none .

Etwas wie das:

<input type="text" name="prevent_autofill" id="prevent_autofill" value="" style="display:none;" />
<input type="password" name="password_fake" id="password_fake" value="" style="display:none;" />
<input type="password" name="password" id="password" value="" />

Hoffe es wird jemandem helfen.

Ich weiß nicht warum, aber das hat mir geholfen und funktioniert.

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

Ich habe keine Ahnung warum, aber autocompelete = "new-password" deaktiviert das automatische Ausfüllen. Es funktionierte in der neuesten Version 49.0.2623.112 Chrome.

Für mich einfach

<form autocomplete="off" role="presentation">

Erledigt.

Bei mehreren Versionen getestet, war der letzte Versuch auf 56.0.2924.87

Sie müssen dieses Attribut hinzufügen:

autocomplete="new-password"

Quelllink: Vollständiger Artikel

Es ist so einfach und knifflig :)

Google Chrome im Grunde für die Suche an jedem ersten sichtbaren Passwort Element innerhalb der <form>, <body>und <iframe>Tags für sie automatisch wieder füllen zu können, so deaktivieren diese Sie ein Dummy - Passwort Element wie folgt hinzufügen müssen:

1. • Wenn sich Ihr Kennwortelement in einem <form>Tag befindet, müssen Sie das Dummy-Element unmittelbar nach dem <form>Öffnen des Tags als erstes Element in Ihr Formular einfügen

   • Wenn sich Ihr Kennwortelement nicht in einem <form>Tag befindet, fügen Sie das Dummy-Element unmittelbar nach dem <body>Öffnen des Tags als erstes Element auf Ihrer HTML-Seite ein

2. Sie müssen das Dummy-Element ausblenden, ohne CSS zu verwenden. Verwenden Sie display:nonedaher grundsätzlich Folgendes als Dummy-Kennwortelement.

   <input type="password" style="width: 0;height: 0; visibility: hidden;position:absolute;left:0;top:0;"/>

Hier sind meine Lösungsvorschläge, da Google darauf besteht, jede Umgehung, die die Leute zu machen scheinen, außer Kraft zu setzen.

Option 1 - Wählen Sie den gesamten Text beim Klicken aus

Stellen Sie die Werte der Eingaben auf ein Beispiel für Ihren Benutzer (z. B. [email protected]) oder die Bezeichnung des Felds (z. B. Email) ein und fügen Sie focus-selectIhren Eingaben eine Klasse hinzu :

<input type="text" name="email" class="focus-select" value="[email protected]">
<input type="password" name="password" class="focus-select" value="password">

Und hier ist die jQuery:

$(document).on('click', '.focus-select', function(){
  $(this).select();
});

Ich kann wirklich nicht sehen, dass Chrome jemals mit Werten herumspielt. Das wäre verrückt. Hoffentlich ist dies eine sichere Lösung.

Option 2 - Setzen Sie den E-Mail-Wert auf ein Leerzeichen und löschen Sie ihn

Angenommen, Sie haben zwei Eingaben, z. B. E-Mail und Kennwort, setzen Sie den Wert des E-Mail-Felds auf " " (ein Leerzeichen) und fügen Sie das Attribut / den Wert hinzu autocomplete="off". Löschen Sie dies dann mit JavaScript. Sie können den Passwortwert leer lassen.

Wenn der Benutzer aus irgendeinem Grund kein JavaScript hat, stellen Sie sicher, dass Sie die Eingabeserver-Seite kürzen (Sie sollten es wahrscheinlich trotzdem sein), falls er den Speicherplatz nicht löscht.

Hier ist die jQuery:

$(document).ready(function() {
  setTimeout(function(){
    $('[autocomplete=off]').val('');
  }, 15);
});

Ich habe eine Zeitüberschreitung eingestellt 15 da dies 5bei meinen Tests gelegentlich zu funktionieren schien. Daher scheint es eine sichere Sache zu sein, diese Zahl zu verdreifachen.

Wenn der Anfangswert nicht auf ein Leerzeichen gesetzt wird, bleibt die Eingabe in Chrome gelb, als hätte sie automatisch ausgefüllt.

Option 3 - versteckte Eingänge

Fügen Sie dies am Anfang des Formulars ein:

<!-- Avoid Chrome autofill -->
<input name="email" class="hide">

CSS:

.hide{ display:none; }

Stellen Sie sicher, dass Sie die HTML-Notiz behalten, damit Ihre anderen Entwickler sie nicht löschen! Stellen Sie außerdem sicher, dass der Name der versteckten Eingabe relevant ist.

Verwenden Sie CSS Text-Security: Disc ohne Typ = Passwort .

html

<input type='text' name='user' autocomplete='off' />
<input type='text' name='pass' autocomplete='off' class='secure' />

or

<form autocomplete='off'>
    <input type='text' name='user' />
    <input type='text' name='pass' class='secure' />
</form>

CSS

input.secure {
    text-security: disc;
    -webkit-text-security: disc;
}

In einigen Fällen schlägt der Browser weiterhin Werte für die automatische Vervollständigung vor, auch wenn das Attribut für die automatische Vervollständigung deaktiviert ist. Dieses unerwartete Verhalten kann für Entwickler ziemlich rätselhaft sein. Der Trick, um die Nicht-Autovervollständigung wirklich zu erzwingen, besteht darin, dem Attribut eine zufällige Zeichenfolge zuzuweisen , zum Beispiel:

autocomplete="nope"

Ich habe festgestellt, dass das Hinzufügen zu einem Formular verhindert, dass Chrome die automatische Ausfüllung verwendet.

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

Hier gefunden. https://code.google.com/p/chromium/issues/detail?id=468153#hc41

Wirklich enttäuschend, dass Chrome entschieden hat, dass es besser als der Entwickler weiß, wann Autocomplete ausgeführt werden soll. Hat ein echtes Microsoft-Feeling.

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

Das Hinzufügen eines schreibgeschützten Attributs zum Tag zusammen mit dem Entfernen des Onfocus-Ereignisses behebt das Problem

Bei Kombinationen aus Benutzername und Passwort ist dieses Problem leicht zu beheben. Die Chromheuristik sucht nach dem Muster:

<input type="text">

gefolgt von:

<input type="password">

Unterbrechen Sie einfach diesen Prozess, indem Sie Folgendes ungültig machen:

<input type="text">
<input type="text" onfocus="this.type='password'">

Die von Mike Nelsons bereitgestellte Lösung funktionierte in Chrome 50.0.2661.102 m nicht. Durch einfaches Hinzufügen eines Eingabeelements desselben Typs mit Anzeige: Kein Satz deaktiviert die automatische Vervollständigung des nativen Browsers nicht mehr. Es ist jetzt erforderlich, das Namensattribut des Eingabefelds zu duplizieren, für das Sie die automatische Vervollständigung deaktivieren möchten.

Um zu vermeiden, dass das Eingabefeld innerhalb eines Formularelements dupliziert wird, sollten Sie das nicht angezeigte Element deaktivieren. Dadurch wird verhindert, dass dieses Element als Teil der Formularaktion gesendet wird.

<input name="dpart" disabled="disabled" type="password" style="display:none;">
<input name="dpart" type="password">
<input type="submit">

Im Jahr 2016 begann Google Chrome zu ignorieren, autocomplete=offobwohl es in W3C ist. Die Antwort, die sie gepostet haben :

Der schwierige Teil hier ist, dass irgendwo auf der Reise des Web Autocomplete = Off für viele Formularfelder zum Standard wird, ohne dass wirklich darüber nachgedacht wird, ob dies für Benutzer gut ist oder nicht. Dies bedeutet nicht, dass es keine sehr gültigen Fälle gibt, in denen der Browser keine Daten automatisch ausfüllen soll (z. B. auf CRM-Systemen), aber im Großen und Ganzen sehen wir diese als Minderheitsfälle. Infolgedessen haben wir begonnen, Autocomplete = Off für Chrome Autofill-Daten zu ignorieren.

Was im Wesentlichen sagt: Wir wissen besser, was ein Benutzer will.

Sie haben einen weiteren Fehler geöffnet, um gültige Anwendungsfälle zu veröffentlichen, wenn Autocomplete = Off erforderlich ist

Ich habe in meiner gesamten B2B-Anwendung keine Probleme im Zusammenhang mit der automatischen Vervollständigung gesehen, sondern nur bei der Eingabe eines Kennworttyps.

Das automatische Ausfüllen erfolgt, wenn auf dem Bildschirm ein Kennwortfeld angezeigt wird, auch ein verstecktes. Um diese Logik zu brechen, können Sie jedes Passwortfeld in eine eigene Form bringen, wenn es Ihre eigene Seitenlogik nicht bricht.

<input type=name >

<form>
    <input type=password >
</form>

Wenn Sie Probleme beim Beibehalten von Platzhaltern haben, aber das automatische Ausfüllen von Chrome deaktivieren, habe ich diese Problemumgehung gefunden.

Problem

HTML

<div class="form">
    <input type="text" placeholder="name"><br>
    <input type="text" placeholder="email"><br>
    <input type="text" placeholder="street"><br>
</div>

http://jsfiddle.net/xmbvwfs6/1/

Das obige Beispiel führt immer noch zum Problem des automatischen Ausfüllens. Wenn Sie jedoch das required="required"und einige CSS verwenden, können Sie die Platzhalter replizieren, und Chrome erkennt die Tags nicht.

Lösung

HTML

<div class="form">
    <input type="text" required="required">
    <label>Name</label>  
    <br>
    <input type="text" required="required">
    <label>Email</label>    
    <br>
    <input type="text" required="required">
    <label>Street</label>    
    <br>
</div>

CSS

input {
    margin-bottom: 10px;
    width: 200px;
    height: 20px;
    padding: 0 10px;
    font-size: 14px;
}
input + label {
    position: relative;
    left: -216px;
    color: #999;
    font-size: 14px;
}
input:invalid + label { 
    display: inline-block; 
}
input:valid + label { 
    display: none; 
}

http://jsfiddle.net/mwshpx1o/1/

Ich mochte es wirklich nicht, versteckte Felder zu machen, ich denke, dass es sehr schnell sehr verwirrend wird, wenn man es so macht.

In den Eingabefeldern, deren automatische Vervollständigung Sie stoppen möchten, funktioniert dies. Machen Sie die Felder schreibgeschützt und entfernen Sie im Fokus dieses Attribut wie folgt

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

Dies bedeutet, dass Sie zuerst das schreibgeschützte Attribut entfernen müssen, indem Sie das Feld auswählen. Zu diesem Zeitpunkt werden Sie höchstwahrscheinlich mit Ihren eigenen Benutzereingaben gefüllt und bücken die automatische Ausfüllung , um die Kontrolle zu übernehmen

Zuvor eingegebene Werte, die von Chrome zwischengespeichert wurden, werden als Dropdown-Auswahlliste angezeigt. Dies kann durch automatische Vervollständigung = Aus deaktiviert werden. Eine explizit gespeicherte Adresse in den erweiterten Einstellungen von Chrome gibt ein Popup-Fenster zum automatischen Ausfüllen an, wenn ein Adressfeld den Fokus erhält. Dies kann durch automatische Vervollständigung = "Falsch" deaktiviert werden. Aber es erlaubt Chrome, zwischengespeicherte Werte in der Dropdown-Liste anzuzeigen.

In einem Eingabe-HTML-Feld werden beide deaktiviert.

Role="presentation" & autocomplete="off"

Bei der Auswahl von Eingabefeldern für das automatische Ausfüllen von Adressen ignoriert Chrome die Eingabefelder, denen das HTML-Element "Label" nicht vorausgeht.

Um sicherzustellen, dass der Chrome-Parser ein Eingabefeld für das Popup zum automatischen Ausfüllen von Adressen ignoriert, kann eine versteckte Schaltfläche oder ein Bildsteuerelement zwischen Beschriftung und Textfeld hinzugefügt werden. Dadurch wird die Chrome-Parsing-Sequenz der Erstellung von Label-Input-Paaren für das automatische Ausfüllen unterbrochen. Kontrollkästchen werden beim Parsen nach Adressfeldern ignoriert

Chrome berücksichtigt auch das Attribut "for" für das Beschriftungselement. Es kann verwendet werden, um die Parsing-Sequenz von Chrom zu unterbrechen.

Da wir alle dieses Problem haben, habe ich einige Zeit investiert, um eine funktionierende jQuery-Erweiterung für dieses Problem zu schreiben. Google muss dem HTML-Markup folgen, nicht wir folgen Google

(function ($) {

"use strict";

$.fn.autoCompleteFix = function(opt) {
    var ro = 'readonly', settings = $.extend({
        attribute : 'autocomplete',
        trigger : {
            disable : ["off"],
            enable : ["on"]
        },
        focus : function() {
            $(this).removeAttr(ro);
        },
        force : false
    }, opt);

    $(this).each(function(i, el) {
        el = $(el);

        if(el.is('form')) {
            var force = (-1 !== $.inArray(el.attr(settings.attribute), settings.trigger.disable))
            el.find('input').autoCompleteFix({force:force});
        } else {
            var disabled = -1 !== $.inArray(el.attr(settings.attribute), settings.trigger.disable);
            var enabled = -1 !== $.inArray(el.attr(settings.attribute), settings.trigger.enable);
            if (settings.force && !enabled || disabled)
                el.attr(ro, ro).focus(settings.focus).val("");
        }
    });
};
})(jQuery);

Fügen Sie dies einfach einer Datei wie /js/jquery.extends.js hinzu und fügen Sie es nach jQuery ein. Wenden Sie es beim Laden des Dokuments wie folgt auf jedes Formularelement an:

$(function() {
    $('form').autoCompleteFix();
});

jsfiddle mit Tests

Versuchen Sie den folgenden jQueryCode, der für mich funktioniert hat.

if ($.browser.webkit) {
    $('input[name="password"]').attr('autocomplete', 'off');
    $('input[name="email"]').attr('autocomplete', 'off');
}

Das hat zwei Teile. Chrome und andere Browser speichern zuvor eingegebene Werte für Feldnamen und stellen dem Benutzer auf dieser Grundlage eine Liste für die automatische Vervollständigung zur Verfügung (insbesondere werden Eingaben vom Kennworttyp aus ziemlich offensichtlichen Gründen auf diese Weise nie gespeichert). Sie können hinzufügen autocomplete="off", um dies beispielsweise in Ihrem E-Mail-Feld zu verhindern.

Sie haben dann jedoch Passwortfüller. Die meisten Browser verfügen über eigene integrierte Implementierungen, und es gibt auch viele Dienstprogramme von Drittanbietern, die diese Funktionalität bereitstellen. Das kannst du nicht aufhören. Dies ist der Benutzer, der seine eigene Entscheidung trifft, diese Informationen zu speichern, um sie später automatisch auszufüllen, und sich vollständig außerhalb des Umfangs und des Einflussbereichs Ihrer Anwendung befindet.

Wie pro Chromium Fehlerbericht # 352347 Chrome nicht mehr respektiertautocomplete="off|false|anythingelse" , weder auf Formen noch an den Eingängen.

Die einzige Lösung, die für mich funktioniert hat, war das Hinzufügen eines Dummy-Passwortfelds :

<input type="password" class="hidden" />
<input type="password" />

Mit der Einstellung autocompleteauf offsollte hier funktionieren, habe ich ein Beispiel, das von Google auf der Suchseite verwendet wird. Ich habe dies von inspect element gefunden.

Bearbeiten : Falls offes nicht funktioniert, versuchen Sie es mit falseoder nofill. In meinem Fall funktioniert es mit Chrome Version 48.0

Hier ist ein schmutziger Hack -

Sie haben Ihr Element hier (Hinzufügen des deaktivierten Attributs):

<input type="text" name="test" id="test" disabled="disabled" />

Und dann am Ende Ihrer Webseite etwas JavaScript einfügen:

<script>
    setTimeout(function(){
        document.getElementById('test').removeAttribute("disabled");
        },100);
</script>

Andere Lösung, Webkit-basiert. Wie bereits erwähnt, vervollständigt Chrome die E-Mail jedes Mal automatisch, wenn Chrome ein Kennwortfeld findet. AFAIK, dies ist unabhängig von Autocomplete = [was auch immer].

Um dies zu umgehen, ändern Sie den Eingabetyp in Text und wenden Sie die Webkit-Sicherheitsschrift in der gewünschten Form an.

.secure-font{
-webkit-text-security:disc;}

<input type ="text" class="secure-font">

Soweit ich sehen kann, ist dies mindestens so sicher wie der Eingabetyp = Passwort. Es ist sicher kopieren und einfügen. Es ist jedoch anfällig, wenn der Stil entfernt wird, mit dem Sternchen entfernt werden. Natürlich kann der Eingabetyp = Kennwort leicht in den Eingabetyp = Text in der Konsole geändert werden, um automatisch ausgefüllte Kennwörter anzuzeigen, sodass es wirklich ähnlich ist.

Der einzige Weg, der für mich funktioniert, war: (jQuery erforderlich)

$(document).ready(function(e) {
    if ($.browser.webkit) {
        $('#input_id').val(' ').val('');
    }
});

Ich habe das gleiche Problem konfrontiert. Und hier ist die Lösung zum Deaktivieren des automatischen Ausfüllens von Benutzername und Passwort in Chrome (nur mit Chrome getestet).

    <!-- Just add this hidden field before password as a charmed solution to prevent auto-fill of browser on remembered password -->
    <input type="tel" hidden />
    <input type="password" ng-minlength="8" ng-maxlength="30" ng-model="user.password" name="password" class="form-control" required placeholder="Input password">