Jak wyłączyć autouzupełnianie przeglądarki w polu formularza / tagu wejściowym?

2789

Jak wyłączyć autocompletew głównych przeglądarkach dla określonego input(lub form field)?

Brett Veenstra
źródło
2
W niektórych systemach, w których testerzy muszą ręcznie wprowadzać wiele informacji w kółko, przydatna może być opcja jako konfigurowalna, aby podczas testowania można ją wyłączyć i po prostu nacisnąć „tab> strzałka w dół> tab> strzałka w dół itp. . ”
Simon_Weaver

Odpowiedzi:

2623

Firefox 30 ignoruje autocomplete="off"hasła, zamiast tego pyta użytkownika, czy hasło powinno być przechowywane na kliencie. Zwróć uwagę na następujący komentarz z 5 maja 2014 r .:

  • Menedżer haseł zawsze pyta, czy chce zapisać hasło. Hasła nie są zapisywane bez zgody użytkownika.
  • Jesteśmy trzecią przeglądarką, która wprowadziła tę zmianę, po IE i Chrome.

Zgodnie z dokumentacją Mozilla Developer Network atrybut Boolean formularza element autocompletezapobiega buforowaniu danych formularza w starszych przeglądarkach.

<input type="text" name="foo" autocomplete="off" />
nlucaroni
źródło
45
To nie zadziałało w Firefoksie 3.0.3. Musiałem umieścić atrybut autouzupełniania w FORMIE, a nie WEJŚCIU.
Winston Fassett,
17
Autouzupełnianie jest zdefiniowane tylko w standardach HTML 5, więc przerwie wszelkie sprawdzania poprawności uruchomione na HTML 4. * ...
Jrgns,
96
@Winston, powinieneś umieścić go zarówno w formularzu, jak i na samym elemencie wejściowym. W ten sposób zabezpieczasz wszystkie niestandardowe przeglądarki.
AviD,
83
I pamiętaj, aby wyłączyć autouzupełnianie = na rozszerzeniu (jeśli używasz Chrome) przed przetestowaniem aplikacji internetowej. W przeciwnym razie poczujesz się tak głupio jak ja. ;)
Jo Liss
314

Oprócz autocomplete=offtego nazwy pól formularzy mogą być losowe według kodu, który generuje stronę, być może poprzez dodanie na końcu nazw ciągów specyficznych dla sesji.

Po przesłaniu formularza możesz go usunąć przed przetworzeniem po stronie serwera. Uniemożliwi to przeglądarce znalezienie kontekstu dla twojego pola, a także może pomóc w zapobieganiu atakom XSRF, ponieważ osoba atakująca nie będzie w stanie odgadnąć nazw pól podczas przesyłania formularza.

Ben Combee
źródło
10
Jest to znacznie lepsze rozwiązanie w porównaniu do używania autocomplete = „off”. Wszystko, co musisz zrobić, to wygenerować nową nazwę przy każdym ładowaniu strony i zapisać ją w $ _SESSION do przyszłego użytku:$_SESSION['codefield_name'] = md5(uniqid('auth', true));
zaczekaj
78
Nie, nie jest to lepsze rozwiązanie, ponieważ źródłem preferencji dla tego ustawienia jest agent użytkownika znany również jako przeglądarka internetowa. Istnieje różnica między wspieraniem pewnych zachowań (które próbuje zrobić HTML 5) a wymuszaniem ich poprzez podejmowanie decyzji w imieniu użytkownika, co według ciebie jest „znacznie lepszym rozwiązaniem”.
2013 r
15
To rozwiązanie może współpracować ze wszystkimi przeglądarkami, więc pod tym względem jest „lepsze”. Mimo to amn ma rację, decyzja o wyłączeniu autouzupełniania w imieniu użytkowników nie jest dobrym pomysłem. Oznacza to, że wyłączałbym autouzupełnianie tylko w bardzo specyficznych sytuacjach, na przykład gdy planujesz zbudować własną funkcję autouzupełniania i nie chcesz konfliktów ani dziwnych zachowań.
macguru2000
8
Jeśli chodzi o ataki XSRF, nie jestem pewien, jaki typ ataku wyobrażałeś sobie, ale czy atakujący nie mógł po prostu usunąć części końcowej w taki sam sposób, jak robisz to po stronie serwera, aby zidentyfikować pola? Lub jeśli atakujący publikuje pola, czy nie może dołączyć własnego losowego ciągu, ponieważ zostanie on usunięty przez serwer?
xr280xr
9
@ macguru2000 budowanie własnego autouzupełniania jest całkowicie uzasadnionym i powszechnym przypadkiem użycia. Naprawdę przeglądarka powinna ułatwić programistom wyłączenie autouzupełniania, gdy będą tego potrzebować, zamiast zmuszać nas do korzystania z hacków takich jak ten
co
235

Większość głównych przeglądarek i menedżerów haseł (poprawnie IMHO) teraz ignoruje autocomplete=off.

Dlaczego? Wiele banków i innych stron o „wysokim bezpieczeństwie” dodanych autocomplete=offdo swoich stron logowania „ze względów bezpieczeństwa”, ale w rzeczywistości zmniejsza to bezpieczeństwo, ponieważ powoduje, że ludzie zmieniają hasła w tych witrynach o wysokim bezpieczeństwie, aby były łatwe do zapamiętania (a tym samym złamania) od momentu autouzupełniania był zepsuty.

Dawno temu większość menedżerów haseł zaczęła ignorować autocomplete=off, a teraz przeglądarki zaczynają robić to samo tylko w przypadku wprowadzania nazwy użytkownika / hasła.

Niestety błędy w autouzupełnianiu implementują wstawianie nazwy użytkownika i / lub hasła w nieodpowiednich polach formularza, powodując błędy sprawdzania poprawności formularza lub jeszcze gorzej, przypadkowo wstawiając nazwy użytkownika w pola, które celowo pozostawiono puste przez użytkownika.

Co robi programista internetowy?

  • Jeśli możesz sam przechowywać wszystkie pola hasła na stronie, to dobry początek, ponieważ wydaje się, że obecność pola hasła jest głównym wyzwalaczem autouzupełniania użytkownika / przepustki w celu uruchomienia. W przeciwnym razie przeczytaj poniższe wskazówki.
  • Safari zauważa, że ​​istnieją 2 pola hasła i wyłącza autouzupełnianie w tym przypadku, zakładając, że musi to być formularz zmiany hasła, a nie formularz logowania. Upewnij się więc, że używasz 2 pól hasła (nowe i potwierdź nowe) dla wszystkich formularzy, na które zezwalasz
  • Chrome 34 niestety spróbuje automatycznie wypełnić pola użytkownik / hasło, gdy tylko zobaczy pole hasła. Jest to dość zły błąd, który - mam nadzieję - zmieni zachowanie Safari. Jednak dodanie tego na górze formularza wydaje się wyłączać automatyczne uzupełnianie hasła:

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

Nie zbadałem jeszcze dokładnie IE ani Firefoksa, ale chętnie zaktualizuję odpowiedź, jeśli inni mają informacje w komentarzach.

apinstein
źródło
5
co masz na myśli
mówiąc,
5
@wutzebaer, Chrome zauważa ukryte pole hasła i zatrzymuje automatyczne uzupełnianie. Podobno ma to na celu zapobieganie kradzieży informacji o hasłach w witrynie bez zauważenia przez użytkownika.
David W
6
Twój fragment kodu zapobiega autouzupełnianiu pól logowania w Chrome, Firefox, IE 8 i IE 10. Nie testowałem IE 11. Dobre rzeczy! Tylko prosta odpowiedź, która nadal działa.
Sam Watkins
3
Twoja notatka z safari wydaje się również działać w Chrome, przynajmniej od grudnia 2015 r. Miałem nazwę użytkownika i hasło w formularzu rejestracyjnym, który był automatycznie uzupełniany danymi z formularza logowania. Utworzenie dwóch type='password'pól na jednej stronie spowodowało, że autouzupełnianie przeglądarki „zapisz hasło” zostało zignorowane, co miało sens, ponieważ formularze rejestracyjne zwykle proszą o hasło dwukrotnie, gdy formularze logowania pytają go tylko raz.
Matt Fletcher,
3
Wygląda na to, że nie działa już w Chrome 55, chyba że dodatkowe pole hasła nie jest ukryte, co nie udaje się.
jokkedk
160

Czasami nawet autouzupełnianie = off będzie nie przeszkadza, aby wypełnić w mandatów w nieodpowiednich obszarach, ale nie użytkownika lub pole nick.

To obejście stanowi uzupełnienie postu apinsteina na temat zachowania przeglądarki.

napraw autouzupełnianie przeglądarki w trybie tylko do odczytu i ustaw zapisywalne fokus (kliknij i tab)

 <input type="password" readonly  
     onfocus="this.removeAttribute('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

Ponieważ przeglądarka automatycznie wypełnia poświadczenia w złym polu tekstowym !?

Zauważyłem 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 wypełnia (zgadując z obserwacji) najbliższe tekstowe pole wejściowe, które pojawia się przed polem hasła w DOM. Ponieważ przeglądarka jest ostatnią instancją i nie można jej kontrolować,

Ta poprawka tylko do odczytu działała dla mnie.

dsuess
źródło
8
A jeśli nie ma javascript, cały formularz kończy się niepowodzeniem. -1
Jimmy Kane
8
@ JimmyKane kluczem byłoby również dodanie atrybutu za pomocą javascript w pierwszej kolejności (czego dsuess nie zrobił tutaj, ale po prostu dodanie ze względu na kompletność).
trnelson
@tmelson Rozumiem, ale wciąż po co używać js, aby wyłączyć? Unikajmy js dla rzeczy, które można ulepszyć natywnie. Znowu się z tobą zgadzam.
Jimmy Kane
3
To nie działa poprawnie w IE8, pole tylko do odczytu hasła nie jest edytowalne przy pierwszym ustawieniu ostrości, tylko po cofnięciu ostrości i ponownym ustawieniu ostrości. Fajny pomysł, ale niestety jest nieco zbyt zuchwały i nie jest bezpieczny w użyciu.
Sam Watkins
To nie działa poprawnie we wszystkich przeglądarkach (np. IE 11 i IE Edge). Zaraz po readonlyusunięciu późniejszy wybór pola powoduje powrót autouzupełniania.
Gone Coding
106
<form name="form1" id="form1" method="post" 
      autocomplete="off" action="http://www.example.com/form.cgi">

Będzie to działać w Internet Explorer i Mozilla FireFox, wadą jest to, że nie jest to standard XHTML.

brendan
źródło
Zauważyłem, że dodanie go do elementu formularza nie zawsze uniemożliwia zastosowanie go do poszczególnych danych wejściowych w formularzu. Dlatego prawdopodobnie najlepiej jest umieścić go bezpośrednio na elemencie wejściowym.
sholsinger
15
Właściwie @sholsinger, najlepiej umieścić go zarówno na formularzu, jak i na samym elemencie wejściowym. W ten sposób zabezpieczasz wszystkie niestandardowe przeglądarki.
AviD,
2
Niestety, od wersji IE 11 Microsoft już tego nie przestrzega input type="password". Mamy nadzieję, że żadna inna przeglądarka nie zdecyduje się na usunięcie tej funkcji.
SamHuckaby
Ustawienie autocomplete="off"na formto jedyną rzeczą, która pracowała dla Chrome.
Andrew
106

Rozwiązaniem dla Chrome jest dodanie autocomplete="new-password"hasła typu wejściowego. Sprawdź poniższy przykład.

Przykład:

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

Chrome zawsze automatycznie uzupełnia dane, jeśli znajdzie pole typu hasło , wystarczające do wskazania tego pola autocomplete = "new-password".

To działa dobrze dla mnie.

Uwaga: upewnij się, F12że wprowadzone zmiany obowiązują, wiele razy przeglądarki zapisują stronę w pamięci podręcznej, co sprawiło, że nie działałem, ale przeglądarka tak naprawdę nie wprowadziła zmian.

Geynen
źródło
2
Działa to w Chrome również w przypadku innych typów pól, a nie tylko wpisz = „hasło”.
Jake,
Użyłem go z hasłem, e-mailem i typem tekstu i zadziałało. Użyłem tego po prostu w ten sposób: autocomplete = "new"
Crak_mboutin 15.01.2018
autocomplete = "nope" name = "pswd" i użył <nazwa wejściowa = "dummyPassword" type = "hasło" style = "display: none;"> przed prawdziwym polem wejściowym hasła. To zadziałało dla mnie.
Denuka
Działa to teraz w prawie wszystkich przeglądarkach, nie tylko w Chrome: autouzupełnianie # Browser_compatibility .
Andrew Morton,
60

Jak powiedzieli inni, odpowiedź brzmi autocomplete="off"

Myślę jednak, że warto wyjaśnić, dlaczego warto to stosować w niektórych przypadkach, ponieważ niektóre odpowiedzi na to pytanie i duplikaty pytań sugerują, że lepiej nie wyłączać tego.

Zatrzymywanie przeglądarek przechowujących numery kart kredytowych nie powinno być pozostawione użytkownikom. Zbyt wielu użytkowników nawet nie zdaje sobie sprawy, że to problem.

Szczególnie ważne jest wyłączenie go w polach kodów bezpieczeństwa kart kredytowych. Jak podaje ta strona :

„Nigdy nie przechowuj kodu bezpieczeństwa ... jego wartość zależy od domniemania, że ​​jedynym sposobem na jego dostarczenie jest odczytanie go z fizycznej karty kredytowej, co dowodzi, że osoba, która go dostarczyła, faktycznie trzyma kartę”.

Problem polega na tym, że jeśli jest to komputer publiczny (kafejka internetowa, biblioteka itp.), Inni użytkownicy mogą łatwo ukraść dane karty, a nawet na własnej maszynie złośliwa witryna może ukraść dane z autouzupełnianiem .

Sam Hasler
źródło
7
gdybym wszedł na stronę i przypomniał sobie moją kartę w menu, byłbym bardzo niezadowolony. zacznę się zastanawiać, jak mogliby być tak nieostrożni.
Simon_Weaver
8
Znacznie prostsza / bardziej krytyczna sprawa. Gdy odwiedzam stronę użytkownika w części administracyjnej mojej witryny, próbuje ona ustawić swoją nazwę użytkownika i hasło na moją nazwę użytkownika i hasło administratora, nie mogąc stwierdzić, że nie jest to formularz logowania. Chcę, aby moje hasło administratora zostało zapamiętane, ale jest to krytyczny błąd, który próbuje zastosować tę zapamiętaną nazwę użytkownika / hasło do wszystkich użytkowników, których następnie edytuję.
rjmunro,
34

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
2
Działa to jeszcze lepiej. Możesz dodać mały JS, który generuje losowy kod dla każdego ładowania strony, i dodać ten kod do pola wejściowego: <code> function autoId () {var autoId = ""; var dict = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; dla (var i = 0; i <12; i ++) {autoId + = dict.charAt (Math.floor (Math.random () * dict.length)); } return autoId; } $ ('. autocompleteoff'). attr ('autocomplete', autoId ()); </code> Możesz dodać autocompleteoffklasę do żądanego pola wejściowego.
Raghuram Kasyap
nie działa w mojej wersji chromowanej 68.0.3440.106 (oficjalna wersja) (64-bit)
Sukanya Purushothaman,
Chrome został
skonfigurowany tak,
1
Niestety działa to lepiej niż to, co nazywa się standardem na chromie
Nour Lababidi,
1
Dzisiaj odkryłem, że Chrome zastąpi losowy ciąg „Off”. Nie mogę uwierzyć, że programiści Chrome robią ten atrybut źle i niekontrolowany. Dlaczego och, mam.
krok
33

Musiałbym zacząć różnić się od tych odpowiedzi, które mówią, aby uniknąć wyłączenia autouzupełniania.

Pierwszą rzeczą, o której należy wspomnieć, jest to, że autouzupełnianie, które nie jest jawnie wyłączone w polach formularza logowania, kończy się niepowodzeniem PCI-DSS. Ponadto, jeśli komputer lokalny użytkownika zostanie przejęty, atakujący może w prosty sposób uzyskać dowolne dane autouzupełniania, ponieważ są one przechowywane w sposób niezauważalny.

Z pewnością istnieje argument za użytecznością, jednak istnieje bardzo dobra równowaga, jeśli chodzi o to, które pola formularza powinny mieć wyłączone autouzupełnianie, a które nie.

Securatek
źródło
Właśnie zwróciłem uwagę na to, że IE nie wyzwala zdarzeń onChange, gdy wypełniasz tekst za pomocą Autouzupełniania. Mamy dziesiątki formularzy i ponad tysiąc zdarzeń onChange (sprawdzanie poprawności danych wejściowych, logika biznesowa) rozrzuconych po nich. Niedawno zaktualizowaliśmy IE do nowszej wersji i nagle zaczęły się dziać dziwne rzeczy. Na szczęście uruchamiamy aplikację intranetową, a autouzupełnianie nie jest dla nas problemem UX, łatwiej jest po prostu ją wyłączyć.
Robotron
3
Jeśli komputer lokalny użytkownika jest zagrożony, są wkręcani, kropka. Może mieć zainstalowany keylogger, może dodać fałszywy certyfikat główny SSL i wszystko wysłane przez fałszywy serwer proxy itp. Mam prawdziwy powód, aby wyłączyć autouzupełnianie - Kiedy loguję się jako administrator i odwiedzam stronę edycji użytkownika, przypisuje ten użytkownik moja nazwa użytkownika i hasło administratora. Muszę temu zapobiec.
rjmunro,
1
Wydaje się, że dostawcy przeglądarek dbają o swoje interesy. Zapisane hasła = zablokowanie użytkownika. A autouzupełnianie włączania / wyłączania było zbyt proste - dlaczego nie skomplikowany standard wskazówek semantycznych ( html.spec.whatwg.org/multipage/... ), który, nawiasem mówiąc, pozwala przeglądarce na zbieranie cennych danych semantycznych ze stron odwiedziny użytkowników?
aro_tech
konkretny przypadek użycia, który próbuję rozwiązać, jest następujący: są już zalogowani, ale teraz mają zamiar uzyskać dostęp do czegoś jeszcze bardziej wrażliwego. Chcę pokazać okno dialogowe, które spowoduje ich ponowne uwierzytelnienie, w przeciwieństwie do możliwości, że odeszli, aby zapalić papierosa, a zły człowiek usiadł na krześle. wypróbowałem kilka technik, aby pokonać autouzupełnianie i nic nie działa. teraz myślę, może przynajmniej zastosuję dobre stare „hasło = okno.prompt („ Proszę ponownie wpisać hasło ”)” plus nazwę użytkownika w sesji i spróbuj to uwierzytelnić.
David
31

Trzy opcje: po pierwsze:

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

Druga:

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

Po trzecie (kod javascript):

$('input').attr('autocomplete', 'off');
yajay
źródło
2
Pierwsza i druga opcja powinny być jedną z opcji, ponieważ zależy to od sposobu, w jaki przeglądarki to obsługują.
rybo111
Próbowałem $ formElement.attr („autouzupełnianie”, „wyłączone”); i to nie działa.
Ben Sinclair,
22

Na pokrewnej, a właściwie zupełnie przeciwnej nucie -

„Jeśli jesteś użytkownikiem wyżej wymienionego formularza i chcesz ponownie włączyć funkcję autouzupełniania, użyj bookmarkletu„ zapamiętaj hasło ”z tej strony bookmarkletów . Usuwa wszystkie autocomplete="off"atrybuty ze wszystkich formularzy na stronie. Walcz dobrze! „

Antti Kissaniemi
źródło
20

W rzeczywistości wykorzystaliśmy pomysł sasb dla jednej strony. Była to aplikacja internetowa do oprogramowania medycznego do prowadzenia gabinetu lekarskiego. Jednak wielu naszych klientów było chirurgami, którzy korzystali z wielu różnych stacji roboczych, w tym z półpublicznych terminali. Chcieli więc upewnić się, że lekarz, który nie rozumie konsekwencji automatycznie zapisanych haseł lub nie zwraca uwagi, nie może przypadkowo pozostawić łatwo dostępnych danych logowania. Oczywiście stało się to wcześniej niż pomysł prywatnego przeglądania, który zaczyna się pojawiać w IE8, FF3.1 itd. Mimo to wielu lekarzy jest zmuszonych używać oldschoolowych przeglądarek w szpitalach z IT, które się nie zmieni.

Mieliśmy więc stronę logowania, która generowała losowe nazwy pól, które działałyby tylko dla tego postu. Tak, jest to mniej wygodne, ale po prostu uderza użytkownika ponad głowę, że nie przechowuje danych logowania na terminalach publicznych.

Jon Adams
źródło
20

Żadne z rozwiązań nie działało dla mnie w tej rozmowie.

W końcu wymyśliłem czyste rozwiązanie HTML, które nie wymaga Javascript , działa w nowoczesnych przeglądarkach (oprócz IE; musiałem mieć co najmniej 1 haczyk, prawda?) I nie wymaga wyłączania autouzupełniania dla całego formularza.

Po prostu wyłącz autouzupełnianie na, forma następnie WŁĄCZ je, inputjeśli chcesz, aby działało w formularzu. Na przykład:

<form autocomplete="off">
    <!-- these inputs will not allow autocomplete and chrome 
         won't highlight them yellow! -->
    <input name="username"  />
    <input name="password" type="password" />
    <!-- this field will allow autocomplete to work even 
         though we've disabled it on the form -->
    <input name="another_field" autocomplete="on" />
</form>
lifo
źródło
Tego właśnie szukałem!
Marco
20

Właśnie ustawiłem autocomplete="off". Jest to bardzo dobry powód: chcesz zapewnić własną funkcjonalność autouzupełniania!

Zagrożone Masa
źródło
20

Próbowałem nieskończonych rozwiązań, a potem znalazłem to:

Zamiast autocomplete="off"po prostu użyćautocomplete="false"

To takie proste i działa jak urok w Google Chrome!

Kaszoni Ferencz
źródło
Jak powiedziałeś w chrome, wartość wyłączenia nie działa. Musi być „fałszywy”
azuax
Działa dla mnie w Chrome 44.0.2403.130.
GuiGS,
1
Próbowałem tego: $ formElement.attr („autouzupełnianie”, „fałsz”); przepraszam nie działa.
Ben Sinclair,
20

To działa dla mnie.

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

Możemy również użyć tej strategii w innych kontrolkach, takich jak tekst, zaznaczanie itp

Muhammad Awais
źródło
to powinna być najnowsza odpowiedź. jedyna odpowiedź, która działa dla mnie w najnowszym chrome
Nick Chan Abdullah
19

Myślę, że autocomplete=offjest obsługiwany w HTML 5.

Zastanów się, dlaczego chcesz to zrobić - w niektórych sytuacjach może to mieć sens, ale nie rób tego tylko ze względu na to.

Jest to mniej wygodne dla użytkowników, a nawet problem bezpieczeństwa w OS X (wspomniany przez Sorena poniżej). Jeśli martwisz się o zdalne kradzież haseł - rejestrator naciśnięć klawiszy nadal może to zrobić, nawet jeśli aplikacja tego używa autcomplete=off.

Jako użytkownik, który zdecyduje się, aby przeglądarka zapamiętała (większość) moich informacji, uważałbym to za irytujące, gdyby Twoja strona nie pamiętała moich.

użytkownik631300
źródło
17

Oprócz

autocomplete="off"

Posługiwać się

readonly onfocus="this.removeAttribute('readonly');"

dla wejść, które nie chcą, żeby zapamiętać dane formularza ( username, passwordetc.), jak pokazano poniżej:

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

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

Mam nadzieję że to pomoże.

Murat Yıldız
źródło
1
Dla mnie w IE11 nie mogę pisać w polu tekstowym nawet po usunięciu przez onfocus atrybutu readonly. Jeśli jednak kliknę pole tekstowe po raz drugi, będę mógł pisać.
mcallahan,
Z IE11 napotkałem ten sam problem (nie mogę pisać do drugiego fokusa). Dodanie rozmycia, a następnie ponowne ustawienie ostrości działa. $(document).on('focus', 'input:password[readonly="readonly"]', function () { $(this).prop('readonly', false).blur().focus(); });
palmsey
@Andrew Jasne, że możesz. Jest to podstawowa zasada, aby przytłoczyć ten problem, a także dodałem aktualizację zawierającą pełny przykład kodu;)
Murat Yıldız
Dodałem równieżonfocusout="this.setAttribute('readonly', 'readonly');"
rinatdobr
16

Najlepszym rozwiązaniem:

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:

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

Objaśnienie: autocompletekontynuuje pracę <input>, autocomplete="off"nie działa, ale można zmienić offciąg znaków na losowy, np nope.

Pracuje w:

  • Chrome: 49, 50, 51, 52, 53, 54, 55, 56, 57, 58, 59, 60, 61, 62, 63 i 64

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

wino
źródło
2
Przekonałem się, że to działa podczas moich wstępnych testów. Tak dziwne, że „wyłączony” nie działa.
Craig Jacobs
To nie działa w Chrome na Androida. Próbowałem ustawić wartości ciągu dla autocompleteatrybutu i nadal wyświetla poprzednie wpisy jako sugestie autouzupełniania pod danymi wejściowymi.
tebs1200,
@ tebs1200 Który? Pole hasła czy pole tekstowe?
Cava,
@Cava przepraszamy za opóźnioną odpowiedź. Pole tekstowe. Nie ma znaczenia, jaką wartość ustawię autocomplete, nadal pojawia się menu sugestii na podstawie wcześniej wprowadzonych wartości. Jest w porządku na komputerze, ale nie na Androidzie Chrome.
tebs1200
14

Trochę za późno na grę ... ale właśnie natknąłem się na ten problem i próbowałem kilku awarii, ale ten działa dla mnie znaleziony w MDN

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 w następujący sposób:

autocomplete="nope"
AAH-Shoot
źródło
13

Dodawanie

autocomplete="off"

na znacznik formularza wyłączy autouzupełnianie przeglądarki (co zostało wcześniej wpisane w tym polu) ze wszystkich inputpól w tym konkretnym formularzu.

Testowane na:

  • Firefox 3.5, 4 BETA
  • Internet Explorer 8
  • Chrom
Haszysz
źródło
13

Dodanie tego autocomplete="off"nie spowoduje cięcia.

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
4
To jest hack. To pole nie jest polem wyszukiwania. W przyszłości może to powodować problemy.
Roel
12

Użyj niestandardowej nazwy i identyfikatora dla pól, aby zamiast „nazwa” mieć „nazwa_”. Przeglądarki nie będą wtedy widzieć go jako pola nazwy. Najlepsze jest to, że możesz to zrobić na niektórych, ale nie na wszystkich polach i automatycznie uzupełni niektóre, ale nie wszystkie pola.

Teifion
źródło
Problem polega na tym, że jeśli jakiekolwiek inne witryny używają „name_”, aby osiągnąć ten sam cel, wracasz do punktu wyjścia.
ConroyP
3
więc zrób to „mysite_name”. Jeśli ktoś tego używa, zadałbym im pytania ...
Steve Perks
to psuje niektóre z tych automatycznych programów do
zapełniania
12

Aby uniknąć nieprawidłowego XHTML, możesz ustawić ten atrybut za pomocą javascript. Przykład użycia jQuery:

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

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

Problem polega na tym, że użytkownicy bez javascript otrzymają funkcję autouzupełniania.

Cherouvim
źródło
38
nie pozwala to uniknąć nieprawidłowego xhtml, po prostu dynamicznie dodaje nieprawidłowy bit po sprawdzeniu go, deklarując, że jest poprawny!
Andiih
@Andiih: Czy istnieje sposób, aby autouzupełnianie działało w formacie xhtml?
Cherouvim
1
Pracuj (lub przestań działać, co jest celem): tak jak powyżej. Ale ważne - nie.
Andiih
11

wypróbuj je również, jeśli po prostu autocomplete="off"nie działa:

autocorrect="off" autocapitalize="off" autocomplete="off"
Jeff
źródło
11

Nie mogę uwierzyć, że jest to problem tak długo po zgłoszeniu. Powyższe rozwiązania nie działały dla mnie, ponieważ safari zdawało się wiedzieć, kiedy element nie był wyświetlany lub poza ekranem, jednak następujące działania działały dla mnie:

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

Mam nadzieję, że jest to przydatne dla kogoś!

Ben
źródło
1
więc umieszczenie tego przed rzeczywistą nazwą użytkownika i polem hasła zadziałało? przeglądarka wypełniła te, a nie prawdziwe
Andrew
11

Oto on:

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

Stav Bodik
źródło
1
Wygląda na dobry pomysł, jeśli stylowe pola tekstowe zapobiegają błyskowi widocznego hasła.
Andrew,
1
Dzięki bardzo, to wykonało zadanie +1, moją odmianą twojego rozwiązania było zrobienie tego pojedynczym wierszem: <input oninput = "this.type = 'password'" id = "inputpassword" type = "text">
Hasnaa Ibraheem,
@HasnaaIbraheem Dzięki (: czasem bardziej czytelny jest lepszy.
Stav Bodik
11

Jest to problem bezpieczeństwa, który przeglądarki ignorują teraz. Przeglądarki identyfikują i przechowują treść za pomocą nazw wejściowych, nawet jeśli programiści uważają, że informacje są wrażliwe i nie należy ich przechowywać. Zróżnicowanie nazwy wejściowej między 2 żądaniami rozwiąże problem (ale nadal zostanie zapisane w pamięci podręcznej przeglądarki i zwiększy pamięć podręczną przeglądarki). Poproś użytkownika o włączenie lub wyłączenie opcji w ustawieniach przeglądarki nie jest dobrym rozwiązaniem. Problem można rozwiązać w backend.

Oto moja poprawka. Podejście, które wdrożyłem w swoich ramach. Wszystkie elementy autouzupełniania są generowane z ukrytym wejściem, takim jak ten:

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

Serwer następnie przetwarza zmienne przesyłane w następujący sposób:

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

Dostęp do wartości można uzyskać jak zwykle

var_dump($_POST['username']);

Przeglądarka nie będzie w stanie sugerować informacji z poprzedniego żądania ani od poprzednich użytkowników.

Wszystko działa jak urok, nawet jeśli aktualizacje przeglądarek chcą zignorować autouzupełnianie lub nie. To był najlepszy sposób na rozwiązanie tego problemu.

Simmoniz
źródło
10

Żaden z wymienionych tu hacków nie działał dla mnie w Chrome. Dyskusja na ten temat tutaj: https://code.google.com/p/chromium/issues/detail?id=468153#c41

Dodanie tego do <form>dzieła (przynajmniej na razie):

<div style="display: none;">
    <input type="text" id="PreventChromeAutocomplete" name="PreventChromeAutocomplete" autocomplete="address-level4" />
</div>
Jakob Løkke Madsen
źródło
1
Pamiętaj, że przy użyciu tej techniki FireFox nadal będzie automatycznie wypełniał to ukryte pole, które zostanie uwzględnione podczas przesyłania formularza. Byłoby to prawdopodobnie złe, ponieważ hasło byłoby następnie przekazywane przez potencjalnie niezabezpieczone połączenie. Na szczęście dodanie maxlength="0"tej opcji uniemożliwia firefoxowi automatyczne wypełnianie pola.
Mikal Schacht Jensen
9

Możesz użyć w danych wejściowych.

Na przykład;

<input type=text name="test" autocomplete="off" />
xxxxx
źródło