Chrome ignoruje autouzupełnianie = „wyłączone”

444

Stworzyłem aplikację internetową, która korzysta z rozwijanego pola tagbox. Działa to doskonale we wszystkich przeglądarkach oprócz przeglądarki Chrome (wersja 21.0.1180.89).

Pomimo obu inputpól ORAZ formpola mającego autocomplete="off"atrybut, Chrome nalega na wyświetlenie rozwijanej historii poprzednich wpisów dla pola, co powoduje zatarcie listy tagbox.

Pan Fett
źródło
10
Technicznie pytanie to zostało zadane około 5 miesięcy przed pytaniem o treści „To pytanie ma już tutaj odpowiedź”. Ten jest duplikatem, jaki powstał po tym.
user3071434,

Odpowiedzi:

318

AKTUALIZACJA

Wygląda na to, że teraz Chrome ignoruje atrybuty style="display: none;"lub style="visibility: hidden;.

Możesz to zmienić na coś takiego:

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

Z mojego doświadczenia wynika, że ​​Chrome automatycznie uzupełnia tylko pierwszy <input type="password">i poprzedni <input>. Więc dodałem:

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

Do góry <form>i sprawa została rozwiązana.

Diogo Cid
źródło
54
to nie działa już chrome 40 nie działa to rozwiązanie
użytkownik881703
8
Jest to nie tylko brzydkie, ale nadal nie mogę znaleźć żadnego wyjaśnienia pytania Dlaczego ?
Augustin Riedinger,
4
Wygląda na to, że Chrome teraz je ignoruje, jeśli display: nie jest używany, więc przesunąłem pola poza pole widzenia z absolutnym pozycjonowaniem ...
Christoph Leiter
1
display: none;zniknie element, nic o autouzupełnianiu.
Sandun Perera
276

Zapobiegaj autouzupełnianiu nazwy użytkownika (lub adresu e-mail) i hasła:

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

Zapobiegaj autouzupełnianiu pola ( może nie działać ):

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

Wyjaśnienie:

autocompletenadal działa na <input>mimo autocomplete="off", ale możesz zmienić offna losowy ciąg, np nope.


Inne „rozwiązania” dla wyłączania autouzupełniania pola (nie jest to właściwy sposób, ale działa):

1.

HTML:

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

JS (obciążenie):

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

lub używając 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 (obciążenie):

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

lub używając jQuery:

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

Aby dodać więcej niż jedno pole za pomocą jQuery:

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>


Pracuje w:

  • Chrome: 49+

  • Firefox: 44+

wino
źródło
Nie ma kodu, tylko w jaki sposób twoja odpowiedź faktycznie zapobiega autouzupełnianiu, jeśli autocomplete = "" ma po prostu zaakceptować wartość logiczną
Tallboy
autocomplete = „nowe-hasło” po przypisaniu do pola hasła, działało dla mnie w chrome. autocomplete = „off” w formularzu nie.
Second2None
2
Najważniejszą (i jedyną rzeczą, która działała dla mnie) było absolutne upewnienie się, że twoja własność ID i Nazwa Twojego pola <input> nie zawierała „Nazwa użytkownika” ani „Hasło”. To skutecznie zatrzymało dla mnie wszystkie autouzupełnianie na autocomplete = "off".
GONeale,
new-passwordjest dobrym haczykiem dla każdego ukrytego wejścia, które tak naprawdę nie jest hasłem, dzięki
antongorodezkiy
Lol autocomplete="nope"faktycznie dla mnie pracował, chyba że dodam go do obu pól formularza. Jakbym mógł mieć go na jednym polu, a wtedy to pole nie będzie autouzupełniania, ale drugie pole będzie nadal autouzupełniania, ale gdy tylko umieściłem je na obu polach, oba z nich ponownie zaczynają się autouzupełniać.
PrintlnParams
147

Wygląda na to, że Chrome teraz ignoruje, autocomplete="off"chyba że jest na <form autocomplete="off">tagu.

lody
źródło
Do React użyj „autoComplete = off”.
zero_cool
Aby uzyskać wyjaśnienie, dlaczego Chrome dokonał tej zmiany, zapoznaj się z odpowiedzią: stackoverflow.com/a/39689037/1766230 - Priorytetem użytkowników są programiści.
Łukasza
12
Jeśli chcesz podać zespołowi Chrome uzasadnione powody używania autocomplete = „off”, zrób to tutaj: bugs.chromium.org/p/chromium/issues/detail?id=587466
Chris
@Digggid Chrome 71 nie ignoruje atrybutu, ale w niektórych przypadkach ignoruje wartość „wyłączony”. Używanie wartości takiej jak „kraj” nadal działa dla mnie.
Burak,
1
Tylko wyjaśnienie powyższego, ponieważ istnieją sprzeczne raporty. Na znaczniku formularza dodaj autocomplete = „off”, a na poszczególnych znacznikach wejściowych dodaj autocomplete = „new-password”. Działa od Chrome 75
AndyP9
83

Nowoczesne podejście

Po prostu wprowadź dane wejściowe readonlyi, na miejscu, usuń je. Jest to bardzo proste podejście, a przeglądarki nie zapełniają readonlydanych wejściowych. Dlatego ta metoda jest akceptowana i nigdy nie zostanie zastąpiona przez przyszłe aktualizacje przeglądarki.

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

Następna część jest opcjonalna. Styluj odpowiednio swoje dane wejściowe, aby nie wyglądały jak dane readonlywejściowe.

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

PRZYKŁAD PRACY

Fizzix
źródło
50
@Basit - I dlatego nazwałem to modern approach. Mniej niż 1% użytkowników na świecie ma wyłączony Javascript. Tak szczerze mówiąc, nie warto nikomu poświęcać czasu dla tak małej grupy odbiorców, gdy znaczna większość stron internetowych korzysta z Javascript. Od bardzo dawna rozwijam strony internetowe, a 100% moich stron korzysta z Javascript i mocno na nim polega. Jeśli użytkownicy mają wyłączony Javascript, jest to ich problem i wybór, a nie mój. Nie będą mogli odwiedzać ani korzystać z co najmniej 90% stron internetowych z wyłączoną funkcją ... Twoja opinia jest całkowicie nieistotna.
Fizzix,
19
To nie działa dzisiaj w 49. „Programiści” Chrome oglądają rozwiązania stackoverflow i usuwają je.
puchu
7
Ta odpowiedź z września 2015 r. Jest w zasadzie kopią odpowiedzi poniżej z listopada 2014 r.
dsuess,
5
2019 - nie działa.
user2060451,
1
Spowodowałoby to uszkodzenie czytników ekranu
Greg
80

Aby uzyskać niezawodne obejście, możesz dodać ten kod do strony układu:

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

Chrome uznaje autouzupełnianie = wyłączone tylko wtedy, gdy w formularzu jest co najmniej jeden inny element wejściowy z dowolną inną wartością autouzupełniania.

To nie będzie działać z polami haseł - w Chrome są one obsługiwane inaczej. Zobacz https://code.google.com/p/chromium/issues/detail?id=468153 więcej szczegółów.

AKTUALIZACJA: Błąd zamknięty jako „Won't Fix” przez Chromium Team 11 marca 2016 r. Zobacz ostatni komentarz w moim pierwotnie złożonym raporcie o błędzie , aby uzyskać pełne wyjaśnienie. TL; DR: użyj semantycznych atrybutów autouzupełniania, takich jak autouzupełnianie = „new-street-address”, aby uniknąć autouzupełniania w Chrome.

JT Taylor
źródło
2
@Jonathan Cowley-Thom: wypróbuj te testowe strony, które zawierają moje obejście. Na hub.securevideo.com/Support/AutocompleteOn powinieneś zobaczyć sugestie autouzupełniania Chrome. Następnie wypróbuj te same wpisy na hub.securevideo.com/Support/AutocompleteOff . Nie powinny być wyświetlane sugestie autouzupełniania Chrome. Właśnie przetestowałem to na Chrome 45.0.2454.101m i 46.0.2490.71m i działało zgodnie z oczekiwaniami na obu.
JT Taylor
Jeszcze jedna aktualizacja w tej sprawie: właśnie otrzymałem powiadomienie od zespołu Chrome, że to zostało naprawione. Mamy nadzieję, że to obejście już wkrótce nie będzie potrzebne!
JT Taylor,
Zobacz mój post powyżej: „To nie będzie działać z polami haseł - są one obsługiwane inaczej w Chrome. Aby uzyskać więcej informacji, zobacz code.google.com/p/chromium/issues/detail?id=468153 ”.
JT Taylor
46

Cóż, trochę późno na imprezę, ale wydaje się, że jest trochę nieporozumień na temat tego, jak autocompletepowinno i nie powinno działać. Zgodnie ze specyfikacjami HTML klient użytkownika (w tym przypadku Chrome) może zastąpić autocomplete:

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

Agent użytkownika może zezwolić użytkownikowi na zastąpienie nazwy pola autouzupełniania elementu, np. Na zmianę go z „wyłączony” na „włączony”, aby umożliwić zapamiętanie i wypełnienie wartości pomimo zastrzeżeń autora strony lub zawsze „wyłączone”, nigdy nie zapamiętując wartości. Jednak programy klienckie nie powinny pozwalać użytkownikom na trywialne zastępowanie nazwy pola autouzupełniania z „wyłącz” na „włączony” lub innych wartości, ponieważ użytkownik ma znaczące konsekwencje dla bezpieczeństwa, jeśli wszystkie wartości są zawsze zapamiętywane, niezależnie od preferencji witryny.

Dlatego w przypadku Chrome programiści zasadniczo powiedzieli: „pozostawimy to użytkownikowi, aby zdecydował w swoich preferencjach, czy chce autocompletepracować, czy nie. Jeśli nie chcesz, nie włączaj go w przeglądarce” .

Wydaje się jednak, że z mojej strony jest to trochę nadgorliwe, ale tak właśnie jest. W specyfikacji omówiono również potencjalne konsekwencje takiego ruchu dla bezpieczeństwa:

Słowo kluczowe „off” wskazuje, że dane wejściowe kontrolki są szczególnie wrażliwe (na przykład kod aktywacyjny dla broni jądrowej); lub że jest to wartość, która nigdy nie zostanie ponownie wykorzystana (na przykład jednorazowy klucz do logowania do banku), a zatem użytkownik będzie musiał za każdym razem jawnie wprowadzać dane, zamiast móc polegać na UA w celu uzupełnienia wartość dla niego; lub że dokument ma własny mechanizm autouzupełniania i nie chce, aby agent użytkownika podawał wartości autouzupełniania.

Po doświadczeniu takiej samej frustracji jak wszyscy inni znalazłem rozwiązanie, które działa dla mnie. Podobnie jest w przypadku autocomplete="false"odpowiedzi.

Artykuł w Mozilli mówi dokładnie o tym problemie:

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

W niektórych przypadkach przeglądarka będzie sugerować wartości autouzupełniania, nawet jeśli atrybut autouzupełniania jest wyłączony. To nieoczekiwane zachowanie może być dość zagadkowe dla programistów. Sztuczka, aby naprawdę wymusić brak ukończenia, polega na przypisaniu losowego ciągu do atrybutu

Więc następujący kod powinien działać:

autocomplete="nope"

Podobnie powinno być każde z poniższych:

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

Widzę problem polegający na tym, że agent przeglądarki może być wystarczająco inteligentny, aby nauczyć się autocompleteatrybutu i zastosować go przy następnym wyświetleniu formularza. Jeśli tak się stanie, jedynym sposobem na obejście problemu jest dynamiczna zmiana autocompletewartości atrybutu podczas generowania strony.

Warto wspomnieć, że wiele przeglądarek ignoruje autocompleteustawienia pól logowania (nazwa użytkownika i hasło). Jak stwierdza artykuł Mozilli:

Z tego powodu wiele współczesnych przeglądarek nie obsługuje autocomplete = „off” dla pól logowania.

  • Jeśli witryna ustawia dla formularza formularz autocomplete = „off”, a formularz zawiera pola wprowadzania nazwy użytkownika i hasła, przeglądarka nadal będzie oferować zapamiętywanie tego loginu, a jeśli użytkownik wyrazi zgodę, przeglądarka automatycznie wypełni te pola następnym razem użytkownik odwiedza tę stronę.
  • Jeśli witryna ustawia opcję autocomplete = "off" dla pól wprowadzania nazwy użytkownika i hasła, przeglądarka nadal będzie oferować zapamiętywanie tego loginu, a jeśli użytkownik wyrazi zgodę, przeglądarka automatycznie wypełni te pola przy następnej wizycie na tej stronie.

Takie zachowanie ma Firefox (od wersji 38), Google Chrome (od 34) i Internet Explorer (od wersji 11).

Na koniec mała informacja o tym, czy atrybut należy do formelementu czy inputelementu. Specyfikacja ponownie ma odpowiedź:

Jeśli atrybut autouzupełniania zostanie pominięty, zostanie użyta wartość domyślna odpowiadająca stanowi atrybutu autouzupełniania właściciela elementu („on” lub „off”). Jeśli nie ma właściciela formularza, używana jest wartość „on”.

Więc. Umieszczenie go w formularzu powinno mieć zastosowanie do wszystkich pól wejściowych. Umieszczenie go na pojedynczym elemencie powinno dotyczyć tylko tego elementu (nawet jeśli nie ma go w formularzu). Jeśli autocompletew ogóle nie jest ustawiony, domyślnie jest ustawiony na on.

Podsumowanie

Aby wyłączyć autocompletew całym formularzu:

<form autocomplete="off" ...>

Lub jeśli musisz to zrobić dynamicznie:

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

Aby wyłączyć autocompletepojedynczy element (niezależnie od tego, czy ustawienie formularza jest obecne, czy nie)

<input autocomplete="off" ...>

Lub jeśli musisz to zrobić dynamicznie:

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

I pamiętaj, że niektóre programy użytkownika mogą zastąpić nawet najcięższe próby wyłączenia autocomplete.

Chuligancat
źródło
1
2019 - nie działa. Wersja 76.0
user2060451
1
@ user2060451 - co nie działa? Właśnie przetestowałem to w wersji 76.0.3809.87 na Windows i Mac. - oba działają zgodnie ze specyfikacją. jak opisano powyżej. Jeśli mógłbyś podać nieco więcej opisu niż „nie działa”, mogę ci pomóc.
Hooligancat
1
Właśnie próbowałem podać (z konsoli po załadowaniu i ustawieniu po stronie serwera) ciąg znaków do autouzupełniania elementu wejściowego, to nie działało. Podanie autocomplete = „off” do elementu form również nie działało.
Nuryagdy Mustapayev
29

Wersja Chrome 34 teraz ignoruje autocomplete=off, zobacz to .

Dużo dyskusji na temat tego, czy jest to dobra czy zła rzecz? Jakie są twoje poglądy?

Peter Kerr
źródło
7
przepraszam za przegłosowanie ... to nie jest strona dyskusyjna (zamiast tego spróbuj quora), a ty nie udzielasz odpowiedzi. Dzięki za link.
commonpike
25

Przeglądarka nie dba o autouzupełnianie = wyłącza auto, a nawet wypełnia dane logowania do złego pola tekstowego?

Naprawiłem to, ustawiając pole hasła na „tylko do odczytu” i aktywowałem je, gdy użytkownik na nie kliknie lub użyje klawisza Tab do tego pola.

napraw autouzupełnianie przeglądarki: tylko do odczytu i ustaw ostrość na zapisywalny (po kliknięciu myszą i tabulacji przez pola)

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

Aktualizacja: Mobile Safari ustawia kursor w polu, ale nie wyświetla wirtualnej klawiatury. Nowa poprawka działa jak poprzednio, ale obsługuje wirtualną klawiaturę:

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

Demo na żywo https://jsfiddle.net/danielsuess/n0scguv6/

// UpdateEnd

Nawiasem mówiąc, więcej informacji na temat mojej obserwacji:

Czasami zauważam to dziwne zachowanie w Chrome i Safari, gdy pola hasła są w tej samej formie. Myślę, że przeglądarka szuka pola hasła, aby wstawić zapisane poświadczenia. Następnie automatycznie uzupełnia nazwę użytkownika do najbliższego pola tekstowego, które pojawia się przed polem hasła w DOM (zgaduję z powodu obserwacji). Ponieważ przeglądarka jest ostatnią instancją i nie można jej kontrolować, czasami nawet autouzupełnianie = wyłączone nie uniemożliwiłoby wypełnienia poświadczeń w złych polach, ale nie w polu użytkownika lub pseudonimu.

dsuess
źródło
2
zamiast używać onfocus, używam setTimeout, aby wyczyścić tylko do odczytu, więc moi użytkownicy nie widzą, że dane wejściowe są tylko do odczytu i nigdy go nie skupiają!
Hippyjim,
23

Możesz użyć autocomplete="new-password"

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

Pracuje w:

  • Chrome: 53, 54, 55
  • Firefox: 48, 49, 50
Steffi
źródło
To nie może działać, ponieważ ciąg autouzupełniania jest naprawiony. Przeglądarki zapamiętują nowe hasło następnym razem.
krok
23

TL; DR: Powiedz Chrome, że jest to nowe hasło i nie dostarczy starych jako autouzupełniania sugestii:

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

autocomplete="off" nie działa z powodu decyzji projektowej - wiele badań pokazuje, że użytkownicy mają znacznie dłuższe i trudniejsze do zhakowania hasła, jeśli mogą je przechowywać w przeglądarce lub menedżerze haseł.

Specyfikacja autocomplete zmieniła się i obsługuje różne wartości, aby formularze logowania były łatwe do automatycznego wypełniania:

<!-- 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" />

Jeśli nie podasz, Chrome nadal próbuje zgadywać, a kiedy to robi, ignoruje autocomplete="off".

Rozwiązaniem jest to, że autocompleteistnieją również wartości formularzy resetowania hasła:

<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>

Możesz użyć tej autocomplete="new-password"flagi, aby Chrome nie zgadywał hasła, nawet jeśli jest ono zapisane dla tej witryny.

Chrome może również zarządzać hasłami do witryn bezpośrednio przy użyciu interfejsu API poświadczeń , który jest standardem i prawdopodobnie będzie miał ostatecznie uniwersalną obsługę.

Keith
źródło
5
Niezbyt przekonujący powód. Fakt, że użytkownik czegoś chce, nie oznacza, że ​​jest to mądry pomysł. To prawie tak złe, jak twierdzenie, że zezwalasz na stosowanie haseł jednoznakowych w aplikacji, ponieważ dla użytkownika jest to wygodniejsze. Czasami bezpieczeństwo przebija wygodę ...
Daniel Kotin
Mam pole o nazwie „ContactNoAlt”, które Chrome nalega na wypełnienie adresu e-mail. Autouzupełnianie włączone / wyłączone jest preferowane, ale konieczne jest obejście go na poziomie praktycznym, ponieważ Chrome jest niestabilny. Mówiąc dokładniej, autocomplete = „off” jest standardem - więc to, co sprawia, że ​​twórcy Chrome są tak dobrzy, że czują, że mogą zignorować standardy - być może pewnego dnia Chrome zdecyduje, że jakiś inny fragment HTML jest niewygodny ... (zaczyna się czuć się jak IE5 / 6 de-ja-vu)
dunxz
Jestem użytkownikiem chrome i nie chcę tego zachowania. Nawet nie zapytał mnie przed automatycznym wypełnieniem wyskakującego pola hasła, aby upewnić się, że tylko ja mogę uzyskać dostęp do aplikacji internetowej. Zapisanie niektórych haseł nie powinno oznaczać autouzupełniania wszystkich haseł.
Hippyjim,
3
Ta odpowiedź (i zachowanie Googlesa) ignoruje fakt, że jednym z głównych powodów, dla których warto to zrobić, jest wdrożenie własnych (np. Listy z bazy danych) zachowań autouzupełniania.
squarelogic.hayden
próbujesz bronić wyraźnie złej decyzji podjętej przez chrome. Wdrażam politykę firmy, której nie mogę zmienić. Więc teraz muszę wstawić hacki do chromu. Obecnie działają. Jeśli przestaną działać, nasza firma zmieni domyślną przeglądarkę dla pracowników. Więc teraz mamy takie samo zachowanie, ale z hackami i prawdopodobnie uszkodzonymi stronami w przyszłych aktualizacjach. I widząc te wszystkie odpowiedzi tutaj, wielu deweloperów używa tych hacków. Dobra robota chrom.
Claudiu Creanga
23

Rozwiązałem niekończącą się walkę z Google Chrome przy użyciu losowych postaci. Kiedy zawsze renderujesz autouzupełnianie za pomocą losowego ciągu, nigdy niczego nie zapamięta.

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

Mam nadzieję, że pomoże to innym ludziom.

krok
źródło
12

Autocomplete="Off" już nie działa.

Spróbuj użyć tylko losowy ciąg zamiast "Off", na przykładAutocomplete="NoAutocomplete"

Mam nadzieję, że to pomoże.

Marco Burrometo
źródło
5
Nie działa w Chrome 73
just_user
10

Widziany chrom ignoruje autocomplete="off" , rozwiązuję go głupio, używając „fałszywych danych wejściowych” do oszukiwania chromu w celu wypełnienia go zamiast wypełniania „prawdziwego”.

Przykład:

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

Chrome wypełni „fałszywe dane wejściowe”, a po przesłaniu serwer przyjmie wartość „rzeczywistych danych wejściowych”.

Chang
źródło
10

Publikuję tę odpowiedź, aby zaktualizować rozwiązanie tego problemu. Obecnie używam Chrome 49 i żadna podana odpowiedź nie działa w tym przypadku. Szukam również rozwiązania współpracującego z innymi przeglądarkami i poprzednimi wersjami.

Umieść ten kod na początku formularza

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

Następnie w polu prawdziwego hasła użyj

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

Skomentuj tę odpowiedź, jeśli nie działa lub jeśli masz problem z inną przeglądarką lub wersją.

Zatwierdzony w dniu:

  • Chrome: 49
  • Firefox: 44, 45
  • Krawędź: 25
  • Internet Explorer: 11
Loenix
źródło
1
Niestety, wersja Chrome 49.0.2623.87 i nie działa dla TextBox, wciąż widzę wyskakujące autouzupełnianie.
eYe
8

każdemu, kto szuka rozwiązania tego problemu, w końcu to rozgryzłem.

Chrome jest zgodny z autocomplete = "off" tylko, jeśli strona jest stroną HTML5 (korzystałem z XHTML).

Po przekonwertowaniu strony na HTML5 problem zniknął (facepalm).

Pan Fett
źródło
6

Zmień atrybut typu danych wejściowych na type="search".

Google nie stosuje automatycznego wypełniania do danych wejściowych z rodzajem wyszukiwania.

Matas Vaitkevicius
źródło
1
Oddam opinię: testowane na chromie 60: to nie zapobiega autouzupełnianiu ..
boly38
6

Aż do zeszłego tygodnia dwa poniższe rozwiązania wydawały się działać w Chrome, IE i Firefox. Ale wraz z wydaniem przeglądarki Chrome w wersji 48 (i wciąż w wersji 49) przestają działać:

  1. W górnej części formularza:
<input style="display:none" type="text" name="fakeUsername"/>
<input style="display:none" type="password" name="fakePassword"/>
  1. W elemencie wprowadzania hasła:

    autocomplete = "wyłączony"

Aby to szybko naprawić, najpierw próbowałem użyć znacznego hackowania, początkowo ustawiając element wejściowy hasła na wyłączony, a następnie użyłem setTimeout w funkcji gotowości dokumentu, aby włączyć go ponownie.

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

Ale to wydawało się takie szalone i szukałem więcej i znalazłem odpowiedź @tibalts w Wyłączanie autouzupełniania Chrome . Jego odpowiedzią jest użycie autocomplete = "new-password" w danych wejściowych haseł i wydaje się, że działa to we wszystkich przeglądarkach (na tym etapie trzymałem moją poprawkę nr 1 powyżej).

Oto link w dyskusji programisty Google Chrome: https://code.google.com/p/chromium/issues/detail?id=370363#c7

prajna
źródło
@JorgeSampayo działa tylko przy wprowadzaniu hasła, ale nie przy wprowadzaniu tekstu.
2016 r. O
6

autocomplete=off jest w dużej mierze ignorowany w nowoczesnych przeglądarkach - głównie ze względu na menedżerów haseł itp.

Możesz spróbować dodać to autocomplete="new-password"nie jest w pełni obsługiwane przez wszystkie przeglądarki, ale działa na niektórych

Mahdi Afzal
źródło
6

autocomplete="off"zwykle działa, ale nie zawsze. To zależy nameod pola wejściowego. Nazwy takie jak „adres”, „e-mail”, „nazwa” - będą uzupełniane automatycznie (przeglądarki uważają, że pomagają użytkownikom), gdy pola takie jak „kod”, „kod PIN” - nie będą wypełniane automatycznie (jeśli autocomplete="off"jest ustawione)

Moje problemy polegały na tym, że autouzupełnianie zadzierało z pomocnikiem adresu google

Naprawiłem to, zmieniając nazwę

od

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

do

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

Testowane w chromie 71.

Jewgienij Afanasiew
źródło
1
Myślę, że to najnowszy sposób na usunięcie autouzupełniania. pracuje w 2020 maja na chrom 81
NIKHIL CM
5

Nie mam pojęcia, dlaczego to zadziałało w moim przypadku, ale na Chrome użyłem, autocomplete="none"a Chrome przestał sugerować adresy dla mojego pola tekstowego.

Chris Sprague
źródło
4

Począwszy od Chrome 42, żadne z rozwiązań / hacków w tym wątku (jak na razie 2015-05-21T12:50:23+00:00) nie działa w celu wyłączenia autouzupełniania dla pojedynczego pola lub całego formularza.

EDYCJA: Odkryłem, że w rzeczywistości wystarczy wstawić tylko jedno fikcyjne pole e-mail do formularza (możesz je ukryć display: none) przed innymi polami, aby zapobiec autouzupełnianiu. Zakładam, że chrome przechowuje jakiś podpis formularza w każdym polu autouzupełniania, a dołączenie innego pola e-mailu uszkadza ten podpis i zapobiega autouzupełnianiu.

<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>

Dobra wiadomość jest taka, że ​​ponieważ „podpis formularza” jest przez to uszkodzony, żadne z pól nie jest wypełniane automatycznie, więc JS nie jest potrzebny do wyczyszczenia fałszywych pól przed przesłaniem.

Stara odpowiedź:

Jedyne, co uważam za nadal wykonalne, to wstawienie dwóch fałszywych pól typu e-mail i hasła przed prawdziwymi polami. Możesz ustawić je tak, display: noneaby je ukrywały (nie jest wystarczająco inteligentne, aby zignorować te pola):

<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>

Niestety pola muszą znajdować się w formularzu (w przeciwnym razie oba zestawy danych wejściowych są wypełniane automatycznie). Tak więc, aby fałszywe pola zostały naprawdę zignorowane, będziesz potrzebować trochę JS do uruchomienia formularza, aby je wyczyścić:

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

Zwróć uwagę, że wyczyszczenie wartości za pomocą Javascript działa w celu zastąpienia autouzupełniania. Jeśli więc utrata prawidłowego zachowania przy wyłączonym JS jest akceptowalna, możesz to wszystko uprościć dzięki autouzupełnianiu JS „polyfill” dla Chrome:

(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);
Bailey Parker
źródło
4

Miałem podobny problem, w którym pole wejściowe zawierało nazwę lub adres e-mail. Ustawiłem autocomplete = "off", ale Chrome wciąż wymusza sugestie. Okazuje się, że było tak, ponieważ tekst zastępczy zawierał słowa „nazwa” i „e-mail”.

Na przykład

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

Obejrzałem to, umieszczając spację o zerowej szerokości w słowach w symbolu zastępczym. Nigdy więcej autouzupełniania Chrome.

<input type="text" placeholder="nam&#8203;e or emai&#8203;l" autocomplete="off" />
WDuffy
źródło
4

W Chrome 48+ użyj tego rozwiązania:

  1. Umieść fałszywe pola przed prawdziwymi polami:

    <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. Ukryj fałszywe pola:

    .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. Zrobiłeś to!

Działa to również w przypadku starszych wersji.

yivo
źródło
@yivo Wygląda na to, że jedyną różnicą między urs a og są!! ważne tagi, więc dodałem je, wciąż nie działają. dropbox.com/s/24yaz6ut7ygkoql/…
Mike Purcell
@MikePurcell Nie masz autocomplete="off"na formtagu. Spróbuj także umieścić fałszywe dane wejściowe natychmiast po formtagu.
yivo
@Yivo: Wypróbowałem twoje sugestie, działało dobrze dla pola e-mail, jednak nadal pojawia się rozwijane automatyczne wypełnianie dla pola hasła. dropbox.com/s/5pm5hjtx1s7eqt3/…
Mike Purcell
3

Po chrom v. 34, zachodzącego autocomplete="off"w <form>tagu pracy doesn `

Wprowadziłem zmiany, aby uniknąć tego irytującego zachowania:

  1. Usuń namei idz hasła
  2. Umieścić klasę na wejściu (np .: passwordInput)

(Jak dotąd Chrome nie umieszcza zapisanego hasła na danych wejściowych, ale formularz jest teraz uszkodzony)

Na koniec, aby formularz działał, uruchom ten kod, aby użytkownik uruchomił się, gdy użytkownik kliknie przycisk wysyłania lub gdy chcesz uruchomić wysyłanie formularza:

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

W moim przypadku miałem hav id="password" name="password" wprowadzałem hasło, więc odkładałem je z powrotem przed uruchomieniem przesyłania.

Renato Lochetti
źródło
3

Po wypróbowaniu wszystkich rozwiązań, oto, co wydaje się działać dla wersji chrome: 45, z formularzem posiadającym pole hasła:

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

Właśnie zaktualizowałem Chrome 49 i rozwiązanie Diogo Cid już nie działa.

Wprowadziłem inne obejście, ukrywając i usuwając pola w czasie wykonywania po załadowaniu strony.

Chrome teraz ignoruje oryginalne obejście, które stosuje poświadczenia do pierwszego wyświetlanego type="password" pola i jego poprzedniego type="text"pola, więc ukryłem oba pola za pomocą CSS visibility: hidden;

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

Wiem, że to może nie wydawać się zbyt eleganckie, ale działa.

Cliff Burton
źródło
2

uznałem to rozwiązanie za najbardziej odpowiednie:

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);
}
}

Musi zostać załadowany po dom gotowy lub po renderowaniu formularza.

użytkownik2241415
źródło
2

Chociaż zgadzam się, że autouzupełnianie powinno być wyborem użytkownika, są chwile, kiedy Chrome jest nadmiernie gorliwy (inne przeglądarki też mogą być). Na przykład pole hasła o innej nazwie jest nadal automatycznie wypełniane zapisanym hasłem, a poprzednie pole jest wypełniane nazwą użytkownika. Jest to szczególnie bolesne, gdy formularz jest formularzem do zarządzania użytkownikami dla aplikacji sieci web i nie chcesz, aby funkcja autouzupełniania wypełniła ją własnymi poświadczeniami.

Chrome całkowicie teraz ignoruje autouzupełnianie = „wyłączone”. Podczas gdy hacki JS mogą dobrze działać, znalazłem prosty sposób, który działa w momencie pisania:

Ustaw wartość pola hasła na znak sterujący 8 ( "\x08"w PHP lub &#8;HTML). Powoduje to, że Chrome nie wypełnia automatycznie pola, ponieważ ma ono wartość, ale nie wprowadzono żadnej wartości rzeczywistej, ponieważ jest to znak cofania.

Tak, to wciąż hack, ale działa dla mnie. YMMV.

spikyjt
źródło
Nie działa w Chrome 40
kaptur
Myślę, że wybrali ten hack i zignorowali wartości kontrolne w wartości, więc teraz ocenia się jako puste. Zobacz odpowiedź autorstwa @ ice-cream stackoverflow.com/a/16130452/752696, aby znaleźć prawidłowe i aktualne rozwiązanie.
spikyjt
Ten sam przypadek użycia tutaj: Praca z zarządzaniem użytkownikami i autouzupełnianie własnych poświadczeń. Ponieważ jednak jest to mój własny kod i ponownie wykorzystuję go formdo tworzenia nowych i edytowania istniejących użytkowników, po prostu przesłaniając inputwartości za pomocą JS usunąłem autouzupełnianie.
nuala