Chrome ignora il completamento automatico = "off"


445

Ho creato un'applicazione Web che utilizza un menu a discesa tagbox. Funziona benissimo in tutti i browser ad eccezione del browser Chrome (versione 21.0.1180.89).

Nonostante entrambi i inputcampi E il formcampo abbiano l' autocomplete="off"attributo, Chrome insiste nel mostrare una cronologia a discesa delle voci precedenti per il campo, che sta cancellando l'elenco di tagbox.


10
Tecnicamente questa domanda è stata posta circa 5 mesi prima di quella indicata come "Questa domanda ha già una risposta qui". Quello è il duplicato come è arrivato dopo questo.
user3071434

Risposte:


318

AGGIORNARE

Sembra che ora Chrome ignori gli attributi style="display: none;"o style="visibility: hidden;.

Puoi cambiarlo in qualcosa del tipo:

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

Nella mia esperienza, Chrome completa solo automaticamente il primo <input type="password">e il precedente <input>. Quindi ho aggiunto:

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

All'inizio del <form>caso e il caso è stato risolto.


54
questo non funziona più Chrome 40 non funziona questa soluzione
user881703

8
Non solo è brutto, ma non riesco ancora a trovare alcuna spiegazione alla domanda Perché ??
Augustin Riedinger,

4
Sembra che Chrome ora li ignori se il display: nessuno è usato, quindi ho spostato i campi fuori dalla vista con posizionamento assoluto ...
Christoph Leiter

2
display: none;scomparirà l'elemento, nulla riguardo al completamento automatico.
Sandun Perera,

276

Impedisci il completamento automatico di nome utente (o e-mail) e password:

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

Impedisci il completamento automatico di un campo ( potrebbe non funzionare ):

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

Spiegazione:

autocompletefunziona ancora su un <input>nonostante autocomplete="off", ma puoi passare offa una stringa casuale, come nope.


Altre "soluzioni" per disabilitare il completamento automatico di un campo (non è il modo giusto per farlo, ma funziona):

1.

HTML:

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

JS (onload):

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

o usando jQuery:

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

2.

HTML:

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

JS (onload):

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

o usando jQuery:

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

Per aggiungere più di un campo utilizzando 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>


Funziona in:

  • Chrome: 49+

  • Firefox: 44+


Non c'è codice, come fa effettivamente la tua risposta a impedire il completamento automatico se il completamento automatico "" "dovrebbe accettare un valore booleano
Tallboy,

autocomplete = "new-password" quando assegnato al campo password, ha funzionato per me in Chrome. autocomplete = "off" nel modulo no.
Second2 Nessuno

2
La cosa più importante (e l'unica cosa che ha funzionato per me) è stata assolutamente garantire che la proprietà ID e nome del campo <input> non contenga "Nome utente" o "Password". Questo ha effettivamente interrotto tutto il completamento automatico per me con il completamento automatico = "off".
GONeale,

new-passwordè una buona cattura per qualsiasi input nascosto che in realtà non è una password, grazie
antongorodezkiy

In autocomplete="nope"realtà Lol ha funzionato per me, a meno che non lo aggiungessi ad entrambi i campi del mio modulo. Come posso averlo su entrambi i campi e quindi quel campo non si completerà automaticamente, ma l'altro campo verrà comunque completato automaticamente, ma non appena lo inserirò in entrambi i campi, entrambi inizieranno di nuovo a completarsi automaticamente.
PrintlnParams

147

Sembra che Chrome ora ignori a autocomplete="off"meno che non sia sul <form autocomplete="off">tag.


Per React usa 'autoComplete = off.'
zero_cool

Per una spiegazione del motivo per cui Chrome ha apportato questa modifica, vedi questa risposta: stackoverflow.com/a/39689037/1766230 - Danno la priorità agli utenti rispetto agli sviluppatori.
Luca,

13
Se desideri fornire al team di Chrome validi motivi per utilizzare il completamento automatico = "off", fallo qui: bugs.chromium.org/p/chromium/issues/detail?id=587466
Chris,

@Digggid Chrome 71 non ignora l'attributo, ma in alcuni casi ignora il valore "off". L'uso di un valore come "country" funziona ancora per me.
Burak,

1
Solo un chiarimento su quanto sopra poiché ci sono rapporti contrastanti. Nel tag del modulo aggiungi autocomplete = "off" e nei singoli tag di input aggiungi autocomplete = "new-password". Funzionando da Chrome 75
AndyP9

83

Approccio moderno

Basta inserire il tuo contributo readonlye, a fuoco, rimuoverlo. Questo è un approccio molto semplice e i browser non popoleranno gli readonlyinput. Pertanto, questo metodo è accettato e non verrà mai sovrascritto da futuri aggiornamenti del browser.

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

La parte successiva è facoltativa. Modella il tuo input di conseguenza in modo che non sembri un readonlyinput.

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

ESEMPIO DI LAVORO


50
@Basit - Ed è per questo che l'ho chiamato a modern approach. Meno dell'1% degli utenti nel mondo ha disattivato Javascript. Quindi, onestamente, non vale la pena a nessuno accomodarsi per un pubblico così piccolo quando la grande maggioranza dei siti Web fa affidamento su Javascript. Sviluppo siti Web da molto tempo ormai, e il 100% dei miei siti utilizza Javascript e si affida fortemente a questo. Se gli utenti hanno disattivato Javascript, questo è il loro problema e la loro scelta, non il mio. Non saranno in grado di visitare o utilizzare almeno il 90% dei siti Web online con esso disattivato ... Il tuo voto negativo è completamente irrilevante.
Fizzix,

19
Questo non funziona oggi nel 49. Chrome "sviluppatori" sta guardando le soluzioni StackOverflow e le sta rimuovendo.
puchu,

7
Questa risposta di settembre 2015 è sostanzialmente una copia della risposta di novembre 2014 in basso.
dsuess,

5
2019 - non funziona.
user2060451

1
Ciò spezzerebbe i lettori dello schermo
Greg,

80

Per una soluzione alternativa affidabile, puoi aggiungere questo codice alla tua pagina di layout:

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

Chrome rispetta il completamento automatico = off solo quando nel modulo è presente almeno un altro elemento di input con qualsiasi altro valore di completamento automatico.

Questo non funzionerà con i campi password: questi sono gestiti in modo molto diverso in Chrome. Consulta https://code.google.com/p/chromium/issues/detail?id=468153 per maggiori dettagli.

AGGIORNAMENTO: Bug chiuso come "Won't Fix" dal Chromium Team l'11 marzo 2016. Vedi l'ultimo commento nella mia segnalazione di bug originariamente presentata , per una spiegazione completa. TL; DR: usa attributi semantici di completamento automatico come autocomplete = "new-street-address" per evitare che Chrome esegua il riempimento automatico.


2
@Jonathan Cowley-Thom: prova queste pagine di test che ho messo su contenenti la mia soluzione alternativa. Su hub.securevideo.com/Support/AutocompleteOn , dovresti vedere i suggerimenti per il completamento automatico di Chrome. Quindi, prova le stesse voci su hub.securevideo.com/Support/AutocompleteOff . Non dovresti visualizzare i suggerimenti per il completamento automatico di Chrome. Ho appena provato questo su Chrome 45.0.2454.101m e 46.0.2490.71m, e ha funzionato come previsto su entrambi.
JT Taylor,

Un altro aggiornamento su questo argomento: ho appena ricevuto una notifica dal team di Chrome che questo è stato risolto. Quindi, spero che questa soluzione alternativa molto presto non sarà più necessaria!
JT Taylor,

Vedi il mio post sopra: "Questo non funzionerà con i campi password - questi sono gestiti in modo molto diverso in Chrome. Vedi code.google.com/p/chromium/issues/detail?id=468153 per maggiori dettagli."
JT Taylor,

46

Bene, un po 'tardi alla festa, ma sembra che ci sia un po' di incomprensioni su come autocompletedovrebbe e non dovrebbe funzionare. Secondo le specifiche HTML, l'agente utente (in questo caso Chrome) può sovrascrivere autocomplete:

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

Un agente utente può consentire all'utente di sovrascrivere il nome del campo di compilazione automatica di un elemento, ad es. Per cambiarlo da "off" a "on" per consentire ai valori di essere ricordati e precompilati nonostante le obiezioni dell'autore della pagina, o di essere sempre "off", senza mai ricordare valori. Tuttavia, i programmi utente non dovrebbero consentire agli utenti di ignorare banalmente il nome del campo di compilazione automatica da "off" a "on" o altri valori, poiché vi sono implicazioni di sicurezza significative per l'utente se tutti i valori vengono sempre ricordati, indipendentemente dalle preferenze del sito.

Quindi, nel caso di Chrome, gli sviluppatori hanno sostanzialmente detto "lasceremo questo all'utente a decidere nelle sue preferenze se vogliono autocompletelavorare o no. Se non lo vuoi, non abilitarlo nel tuo browser" .

Tuttavia, sembra che questo sia un po 'troppo zelante da parte mia per i miei gusti, ma è così. La specifica discute anche le potenziali implicazioni di sicurezza di una tale mossa:

La parola chiave "off" indica che i dati di input del controllo sono particolarmente sensibili (ad esempio il codice di attivazione per un'arma nucleare); o che si tratta di un valore che non verrà mai riutilizzato (ad esempio una chiave unica per un accesso bancario) e che quindi l'utente dovrà inserire esplicitamente i dati ogni volta, invece di poter fare affidamento su UA per precompilare il valore per lui; o che il documento fornisce il proprio meccanismo di completamento automatico e non desidera che l'agente utente fornisca i valori di completamento automatico.

Quindi, dopo aver provato la stessa frustrazione di tutti gli altri, ho trovato una soluzione che funziona per me. È simile in vena alle autocomplete="false"risposte.

Un articolo di Mozilla parla esattamente di questo problema:

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

In alcuni casi, il browser continuerà a suggerire i valori di completamento automatico anche se l'attributo di completamento automatico è disattivato. Questo comportamento inaspettato può essere abbastanza sconcertante per gli sviluppatori. Il trucco per forzare davvero il non completamento è quello di assegnare una stringa casuale all'attributo

Quindi il seguente codice dovrebbe funzionare:

autocomplete="nope"

E così dovrebbe ciascuno dei seguenti:

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

Il problema che vedo è che l'agente del browser potrebbe essere abbastanza intelligente da apprendere l' autocompleteattributo e applicarlo la prossima volta che vede il modulo. In tal caso, l'unico modo in cui riesco a risolvere il problema sarebbe quello di modificare dinamicamente il autocompletevalore dell'attributo quando viene generata la pagina.

Un punto degno di nota è che molti browser ignoreranno le autocompleteimpostazioni per i campi di accesso (nome utente e password). Come afferma l'articolo di Mozilla:

Per questo motivo, molti browser moderni non supportano il completamento automatico = "off" per i campi di accesso.

  • Se un sito imposta autocomplete = "off" per un modulo e il modulo include campi di immissione nome utente e password, il browser offrirà comunque di ricordare questo accesso e, se l'utente accetta, il browser riempirà automaticamente quei campi la prossima volta che l'utente visita questa pagina.
  • Se un sito imposta autocomplete = "off" per i campi di immissione del nome utente e della password, il browser offrirà comunque di ricordare questo accesso e, se l'utente acconsente, il browser riempirà automaticamente quei campi la volta successiva che l'utente visita questa pagina.

Questo è il comportamento in Firefox (dalla versione 38), Google Chrome (dalla 34) e Internet Explorer (dalla versione 11).

Finalmente alcune informazioni sul fatto che l'attributo appartenga formall'elemento o inputall'elemento. Le specifiche hanno di nuovo la risposta:

Se l'attributo di completamento automatico viene omesso, viene invece utilizzato il valore predefinito corrispondente allo stato dell'attributo di completamento automatico del proprietario del modulo dell'elemento ("on" o "off"). Se non è presente alcun proprietario del modulo, viene utilizzato il valore "on".

Così. Inserendolo nel modulo dovrebbe applicarsi a tutti i campi di input. Metterlo su un singolo elemento dovrebbe applicarsi solo a quell'elemento (anche se non ce n'è uno nel modulo). Se autocompletenon impostato affatto, per impostazione predefinita è on.

Sommario

Per disabilitare autocompletesull'intero modulo:

<form autocomplete="off" ...>

O se hai bisogno di farlo dinamicamente:

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

Per disabilitare autocompletesu un singolo elemento (indipendentemente dall'impostazione del modulo presente o meno)

<input autocomplete="off" ...>

O se hai bisogno di farlo dinamicamente:

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

E ricorda che alcuni programmi utente possono ignorare anche i tuoi tentativi più difficili di disabilitare autocomplete.


1
2019 - non funziona. Versione 76.0
user2060451

1
@ user2060451 - cosa non funziona? L'ho appena provato in 76.0.3809.87 su Windows e Mac. - entrambi eseguono secondo le specifiche. come descritto sopra. Se potessi fornire una descrizione un po 'più di "non funziona", potrei essere in grado di aiutarti.
Teppista

1
Ho appena provato a dare (dalla console dopo che tutto è stato caricato e impostato sul lato server) una stringa casuale per il completamento automatico dell'elemento di input, non ha funzionato. Anche il completamento automatico = "off" per formare l'elemento non ha funzionato.
Nuryagdy Mustapayev,


29

La versione 34 di Chrome ora ignora il autocomplete=off, vedi questo .

Molte discussioni sul fatto che questa sia una cosa buona o cattiva? Qual è il tuo punto di vista?


7
scusate il downvote ... questo non è un sito di discussione (provate invece quora) e non fornite una risposta. Grazie comunque per il link.
commonpike

25

Il browser non si preoccupa del completamento automatico = off auto o addirittura riempie le credenziali nel campo di testo sbagliato?

L'ho risolto impostando il campo password su sola lettura e attivandolo, quando l'utente fa clic su di esso o utilizza il tasto tab per questo campo.

correggi la compilazione automatica del browser: sola lettura e attiva la scrittura in focus (con il clic del mouse e la tabulazione tra i campi)

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

Aggiornamento: Mobile Safari imposta il cursore sul campo, ma non mostra la tastiera virtuale. La nuova correzione funziona come prima ma gestisce la tastiera virtuale:

<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 live https://jsfiddle.net/danielsuess/n0scguv6/

// UpdateEnd

A proposito, ulteriori informazioni sulla mia osservazione:

A volte noto questo strano comportamento su Chrome e Safari, quando ci sono campi password nella stessa forma. Suppongo che il browser cerchi un campo password per inserire le credenziali salvate. Quindi compila automaticamente il nome utente nel campo di input simile al testo più vicino, che appare prima del campo della password in DOM (solo indovinando a causa dell'osservazione). Poiché il browser è l'ultima istanza e non è possibile controllarlo, a volte anche il completamento automatico = off non impedisce di compilare le credenziali in campi errati, ma non nel campo utente o nickname.


2
piuttosto che usare onfocus, uso un setTimeout per cancellare il readonly, quindi i miei utenti non vedono l'input in sola lettura e non lo focalizzano mai!
Hippyjim

23

Puoi usare autocomplete="new-password"

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

Funziona in:

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

Questo non può funzionare, perché la stringa di completamento automatico è fissa. I browser ricorderanno la nuova password per la prossima volta.
passaggio

23

TL; DR: comunica a Chrome che si tratta di un nuovo input di password e che non fornirà quelli vecchi come suggerimenti di completamento automatico:

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

autocomplete="off" non funziona a causa di una decisione di progettazione: molte ricerche dimostrano che gli utenti hanno molto più tempo e difficoltà a violare le password se possono archiviarle in un browser o in un gestore di password.

Le specifiche per autocomplete sono cambiate e ora supportano vari valori per semplificare il completamento automatico dei moduli di accesso:

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

Se non fornisci questi Chrome cerca ancora di indovinare e quando lo fa ignora autocomplete="off".

La soluzione è che autocompleteesistono anche valori per i moduli di reimpostazione della password:

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

Puoi utilizzare questo autocomplete="new-password"flag per dire a Chrome di non indovinare la password, anche se ne ha una memorizzata per questo sito.

Chrome può anche gestire le password per i siti direttamente utilizzando l' API delle credenziali , che è uno standard e probabilmente avrà eventualmente il supporto universale.


5
Non è un motivo davvero convincente. Il fatto che l'utente desideri qualcosa non significa che sia un'idea intelligente. È quasi come dire che consentirai password a carattere singolo nella tua applicazione perché l'utente lo trova più conveniente. A volte, la sicurezza supera la convenienza ...
Daniel Kotin,

Ho un campo chiamato "ContactNoAlt" che Chrome insiste per riempire con un indirizzo email. L'attivazione / disattivazione del completamento automatico è preferibile, ma è necessaria una soluzione alternativa a livello pratico perché Chrome è falso. Più precisamente autocomplete = "off" è uno standard, quindi ciò che rende gli sviluppatori di Chrome così bravi da ritenere di poter ignorare gli standard, forse un giorno Chrome deciderà che qualche altro pezzo di HTML è scomodo .... (questo sta iniziando sentirsi come IE5 / 6 de-ja-vu)
dunxz

Sono un utente Chrome e non voglio questo comportamento. Non mi ha nemmeno chiesto prima di compilare automaticamente la casella della password che stava spuntando per assicurarsi che solo io potessi accedere all'applicazione web in questione. Salvare alcune password non dovrebbe significare il completamento automatico di tutte le password.
Hippyjim

3
Questa risposta (e il comportamento di Google) ignorano il fatto che uno dei motivi principali che potresti voler fare è implementare i tuoi comportamenti di autocompletamento (ad es., Elenco dal database).
squarelogic.hayden,

stai cercando di difendere una decisione chiaramente sbagliata presa da Chrome. Sto implementando la politica aziendale che non posso cambiare. Quindi ora devo inserire hack per Chrome. Attualmente lavorano. Se smettono di funzionare, la nostra azienda cambierà il browser predefinito per i dipendenti. Quindi ora abbiamo lo stesso comportamento ma con hack e pagine eventualmente spezzate in futuri aggiornamenti. E vedendo tutte queste risposte qui ci sono molti sviluppatori che usano questi hack. Chrome ben fatto.
Claudiu Creanga,

23

Ho risolto la lotta senza fine con Google Chrome con l'uso di personaggi casuali. Quando esegui sempre il rendering con completamento casuale con stringa casuale, non ricorderà mai nulla.

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

Spero che possa aiutare altre persone.


12

Autocomplete="Off" non funziona più.

Prova ad usare solo una stringa casuale anziché "Off", ad esempioAutocomplete="NoAutocomplete"

Spero possa essere d'aiuto.


5
Non funziona in Chrome 73
just_user

10

Visto che Chrome ignora il autocomplete="off", lo risolvo in modo stupido che sta usando "input falsi" per ingannare Chrome per riempirlo invece di riempire quello "reale".

Esempio:

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

Chrome riempirà l '"input falso" e, al momento dell'invio, il server prenderà il valore "input reale".


10

Sto pubblicando questa risposta per portare una soluzione aggiornata a questo problema. Attualmente sto usando Chrome 49 e nessuna risposta ha funzionato per questo. Sto anche cercando una soluzione che funzioni con altri browser e versioni precedenti.

Inserisci questo codice all'inizio del modulo

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

Quindi, per il campo della password reale, utilizzare

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

Commenta questa risposta se non funziona più o se riscontri un problema con un altro browser o versione.

Approvato il:

  • Chrome: 49
  • Firefox: 44, 45
  • Bordo: 25
  • Internet Explorer: 11

1
Sfortunatamente, la versione 49.0.2623.87 di Chrome e non funziona per TextBox, vedo ancora apparire il completamento automatico.
eYe

8

a chiunque cerchi una soluzione a questo, finalmente lo capisco.

Chrome obbedisce solo al completamento automatico = "off" se la pagina è una pagina HTML5 (stavo usando XHTML).

Ho convertito la mia pagina in HTML5 e il problema è scomparso (facepalm).


6

Cambia l'attributo del tipo di input in type="search".

Google non applica il riempimento automatico agli input con un tipo di ricerca.


1
Downvote: testato su Chrome 60: questo non impedisce il completamento automatico ..
boly38

6

Fino a quest'ultima settimana, le due soluzioni seguenti sembravano funzionare per Chrome, IE e Firefox. Ma con il rilascio di Chrome versione 48 (e ancora in 49), non funzionano più:

  1. Quanto segue nella parte superiore del modulo:
<input style="display:none" type="text" name="fakeUsername"/>
<input style="display:none" type="password" name="fakePassword"/>
  1. Quanto segue nell'elemento di input della password:

    autocomplete = "off"

Quindi, per risolvere rapidamente questo problema, all'inizio ho provato a utilizzare un trucco importante di impostazione iniziale dell'elemento di input della password su disabilitato e quindi ho usato un setTimeout nella funzione di pronto del documento per abilitarlo di nuovo.

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

Ma questo sembrava così folle e ho fatto qualche altra ricerca e ho trovato la risposta @tibalts in Disabilitazione del riempimento automatico di Chrome . La sua risposta è usare autocomplete = "new-password" nell'input delle password e questo sembra funzionare su tutti i browser (in questa fase ho mantenuto il mio numero di correzione 1 sopra).

Ecco il link nella discussione degli sviluppatori di Google Chrome: https://code.google.com/p/chromium/issues/detail?id=370363#c7


@JorgeSampayo Funziona solo su input di password ma non su input di testo.
eYe

6

autocomplete=off è ampiamente ignorato nei browser moderni, principalmente a causa di gestori di password, ecc.

Puoi provare ad aggiungere questo autocomplete="new-password"non è completamente supportato da tutti i browser, ma funziona su alcuni


6

autocomplete="off"di solito funziona, ma non sempre. Dipende dal campo namedi input. Nomi come "indirizzo", "email", "nome" - verranno completati automaticamente (i browser pensano di aiutare gli utenti), quando campi come "codice", "pin" - non verranno completati automaticamente (se autocomplete="off"impostato)

I miei problemi erano: il completamento automatico stava scherzando con l' helper dell'indirizzo Google

L'ho risolto rinominandolo

a partire dal

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

per

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

Testato in cromo 71.


1
Penso che questo sia l'ultimo modo per rimuovere il completamento automatico. lavorando nel 2020 maggio su chrome 81
NIKHIL CM


5

Non ho idea del perché questo abbia funzionato nel mio caso, ma su Chrome ho usato autocomplete="none"e Chrome ha smesso di suggerire indirizzi per il mio campo di testo.


4

A partire da Chrome 42, nessuna delle soluzioni / hack in questo thread (a partire da 2015-05-21T12:50:23+00:00) funziona per disabilitare il completamento automatico per un singolo campo o l'intero modulo.

EDIT: ho scoperto che in realtà devi solo inserire un campo e-mail fittizio nel tuo modulo (puoi nasconderlo con display: none) prima degli altri campi per impedire il completamento automatico. Presumo che Chrome memorizzi una sorta di firma del modulo con ciascun campo compilato automaticamente e che includa un altro campo di posta elettronica corrompe questa firma e impedisce il completamento automatico.

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

La buona notizia è che poiché la "firma del modulo" è corrotta da questo, nessuno dei campi viene compilato automaticamente, quindi non è necessario JS per cancellare i campi falsi prima dell'invio.

Vecchia risposta:

L'unica cosa che ho trovato ancora fattibile è inserire due campi fittizi di tipo email e password prima dei campi reali. Puoi impostarli display: noneper nasconderli (non è abbastanza intelligente da ignorare quei campi):

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

Sfortunatamente, i campi devono essere all'interno del modulo (altrimenti entrambi i set di input vengono compilati automaticamente). Quindi, affinché i campi falsi vengano veramente ignorati, dovrai eseguire alcuni JS per inviare il modulo per cancellarli:

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

Si noti dall'alto che la cancellazione del valore con Javascript funziona per sovrascrivere il completamento automatico. Quindi, se perdere il comportamento corretto con JS disabilitato è accettabile, puoi semplificare tutto con un "polyfill" con completamento automatico JS per 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);

4

Ho avuto un problema simile in cui il campo di input ha assunto un nome o un'email. Ho impostato autocomplete = "off" ma Chrome ha comunque forzato i suggerimenti. Si scopre che era perché il testo segnaposto conteneva le parole "nome" ed "e-mail".

Per esempio

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

L'ho aggirato inserendo uno spazio di larghezza zero nelle parole nel segnaposto. Niente più completamento automatico di Chrome.

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

4

In Chrome 48+ usa questa soluzione:

  1. Metti i campi falsi prima dei campi reali:

    <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. Nascondi campi falsi:

    .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. Ce l'hai fatta!

Anche questo funzionerà per le versioni precedenti.


@yivo Sembra che l'unica differenza tra urs e og response sia il! tag importante, quindi le ho aggiunte, ancora non funzionanti. dropbox.com/s/24yaz6ut7ygkoql/…
Mike Purcell,

@MikePurcell Non avete autocomplete="off"sul formtag. Prova anche a inserire input falsi subito dopo il formtag.
yivo,

@Yivo: ho provato i tuoi suggerimenti, ha funzionato bene per il campo e-mail, tuttavia il menu a discesa di compilazione automatica si verifica ancora per il campo password. dropbox.com/s/5pm5hjtx1s7eqt3/…
Mike Purcell

3

Dopo Chrome v. 34, l'impostazione autocomplete="off"al <form>tag non funziona

Ho apportato le modifiche per evitare questo fastidioso comportamento:

  1. Rimuovere la namee idla password di input
  2. Mettere una classe in ingresso (es .: passwordInput)

(Finora, Chrome non ha inserito la password salvata nell'input, ma il modulo è ora rotto)

Infine, per far funzionare il modulo, metti questo codice in esecuzione quando l'utente fa clic sul pulsante di invio o quando vuoi attivare l'invio del modulo:

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

Nel mio caso, ho usato id="password" name="password"l'inserimento della password, quindi li ho rimessi prima di innescare l'invio.


3

Dopo aver provato tutte le soluzioni, ecco cosa sembra funzionare per la versione di Chrome: 45, con modulo con campo password:

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

3

Ho appena aggiornato a Chrome 49 e la soluzione di Diogo Cid non funziona più.

Ho eseguito una soluzione alternativa nascondendo e rimuovendo i campi in fase di esecuzione dopo il caricamento della pagina.

Chrome ora ignora la soluzione alternativa originale applicando le credenziali al primo campo visualizzato type="password" e al type="text"campo precedente , quindi ho nascosto entrambi i campi utilizzando 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();
    });
});

So che potrebbe non sembrare molto elegante ma funziona.


2

ho trovato questa soluzione la più appropriata:

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

Deve essere caricato dopo il dom pronto o dopo il rendering del modulo.


2

Mentre sono d'accordo che il completamento automatico dovrebbe essere una scelta dell'utente, ci sono momenti in cui Chrome è troppo zelante con esso (anche altri browser potrebbero esserlo). Ad esempio, un campo password con un nome diverso viene comunque compilato automaticamente con una password salvata e il campo precedente popolato con il nome utente. Ciò fa particolarmente schifo quando il modulo è un modulo di gestione utenti per un'app Web e non si desidera compilare automaticamente per compilarlo con le proprie credenziali.

Chrome ora ignora completamente il completamento automatico = "off". Mentre gli hack di JS potrebbero funzionare, ho trovato un modo semplice che funziona al momento della scrittura:

Imposta il valore del campo password sul carattere di controllo 8 ( "\x08"in PHP o &#8;in HTML). In questo modo Chrome riempie automaticamente il campo perché ha un valore, ma non viene inserito alcun valore effettivo perché si tratta del carattere backspace.

Sì, questo è ancora un trucco, ma funziona per me. YMMV.


Non sembra funzionare in Chrome 40
Hood

Penso che abbiano raccolto questo hack e ignorato i caratteri di controllo nel valore, quindi ora viene valutato come vuoto. Vedere la risposta di @ ice-cream stackoverflow.com/a/16130452/752696 per la soluzione corretta e aggiornata.
spikyjt,

Stesso caso d'uso qui: lavorare con la gestione degli utenti e avere le proprie credenziali compilate automaticamente. Tuttavia, poiché è il mio codice e riutilizzo quello formper la creazione e la modifica di utenti esistenti semplicemente ignorando i inputvalori tramite JS, il completamento automatico è stato rimosso.
nuala,
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.