Google Chrome Formular-Autofill und sein gelber Hintergrund

Question

Ich habe ein Designproblem mit Google Chrome und seiner Formular-Ausfüllfunktion. Wenn Chrome sich an einige Anmeldeinformationen erinnert, ändert es die Hintergrundfarbe in Gelb.

Hier sind einige Screenshots:

Wie kann man diesen Hintergrund entfernen oder einfach diese Autofill-Funktion deaktivieren?

Answer 1

Dies behebt das Problem sowohl in Safari als auch in Chrome

if(navigator.userAgent.toLowerCase().indexOf("chrome") >= 0 || navigator.userAgent.toLowerCase().indexOf("safari") >= 0){
window.setInterval(function(){
    $('input:-webkit-autofill').each(function(){
        var clone = $(this).clone(true, true);
        $(this).after(clone).remove();
    });
}, 20);
}

Answer 2

Dies hat mir geholfen, eine reine CSS-Version.

input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px weißen Einschub; }

wo weiß jede gewünschte Farbe sein kann.

Answer 3

Ich benutze dies,

input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset !important; }
input:focus:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset !important; }
/* Sie können color:#Farbe verwenden, um die Farbe zu ändern */

Answer 4

Wenn Sie den gelben Flackern vermeiden möchten, bis Ihr CSS angewendet wird, fügen Sie diesem Element eine Transition hinzu, wie folgt:

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
    transition: background-color 10s ease-in-out 0s;
}

Answer 5

In Ihrer Tag fügen Sie einfach diese kleine Codezeile ein.

autocomplete="off"

Platzieren Sie dies jedoch nicht im Benutzername/E-Mail/ID-Feld, da dies das Autocomplete deaktivieren würde. Ich habe jedoch einen Weg gefunden, dies zu umgehen, indem Sie den Code einfach in Ihr Passwort-Eingabefeld platzieren, da Passwörter sowieso nie autocompleted werden. Diese Lösung sollte die Zwangsfarbe entfernen, die Autocomplete-Fähigkeit für Ihr E-Mail/Benutzername-Feld beibehalten und es Ihnen ermöglichen, sperrige Hacks wie Jquery oder Javascript zu vermeiden.