He creado una aplicación web que utiliza un menú desplegable de tagbox. Esto funciona muy bien en todos los navegadores, excepto el navegador Chrome (Versión 21.0.1180.89).

A pesar de que tanto los inputcampos Y el formcampo que tiene el autocomplete="off"atributo, Chrome insiste en mostrar un historial desplegable de entradas anteriores para el campo, que está borrando la lista de etiquetas.

ACTUALIZAR

Parece que ahora Chrome ignora los atributos style="display: none;"o style="visibility: hidden;.

Puedes cambiarlo a algo como:

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

En mi experiencia, Chrome solo completa automáticamente el primero <input type="password">y el anterior <input>. Entonces agregué:

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

En la parte superior de la <form>y el caso fue resuelto.

Evite el autocompletado de nombre de usuario (o correo electrónico) y contraseña:

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

Evitar autocompletar un campo ( podría no funcionar ):

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

Explicación:

autocompletetodavía funciona en un <input>pese a tener autocomplete="off", pero puede cambiar offa una cadena aleatoria, como nope.

Otras "soluciones" para deshabilitar el autocompletado de un campo (no es la forma correcta de hacerlo, pero funciona):

1)

HTML:

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

JS (carga):

(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 (carga):

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

Para agregar más de un campo usando 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>

Trabaja en:

• Chrome: 49+

• Firefox: 44+

Parece que Chrome ahora ignora a autocomplete="off"menos que esté en la <form autocomplete="off">etiqueta.

Enfoque moderno

Simplemente haga su entrada readonlyy, en foco, retírela. Este es un enfoque muy simple y los navegadores no llenarán readonlyentradas. Por lo tanto, este método es aceptado y nunca será sobrescrito por futuras actualizaciones del navegador.

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

La siguiente parte es opcional. Diseñe su entrada en consecuencia para que no se vea como una readonlyentrada.

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

EJEMPLO DE TRABAJO

Para una solución alternativa confiable, puede agregar este código a su página de diseño:

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

Chrome respeta autocompletar = desactivado solo cuando hay al menos otro elemento de entrada en el formulario con cualquier otro valor de autocompletar.

Esto no funcionará con los campos de contraseña, que se manejan de manera muy diferente en Chrome. Consulte https://code.google.com/p/chromium/issues/detail?id=468153 para obtener más detalles.

ACTUALIZACIÓN: El equipo de Chromium cerró el error como "No se solucionará" el 11 de marzo de 2016. Vea el último comentario en mi informe de error presentado originalmente , para obtener una explicación completa. TL; DR: utilice atributos semánticos de autocompletado como autocomplete = "new-street-address" para evitar que Chrome realice el autocompletado.

Bueno, un poco tarde para la fiesta, pero parece que hay un pequeño malentendido sobre cómo autocompletedebería y no debería funcionar. De acuerdo con las especificaciones HTML, el agente de usuario (en este caso Chrome) puede anular autocomplete:

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

Un agente de usuario puede permitirle anular el nombre del campo de autocompletar de un elemento, por ejemplo, cambiarlo de "desactivado" a "activado" para permitir que los valores se recuerden y se completen previamente a pesar de las objeciones del autor de la página, o siempre "desactivado", sin recordar nunca valores. Sin embargo, los agentes de usuario no deben permitir que los usuarios anulen trivialmente el nombre del campo de autocompletar de "desactivado" a "activado" u otros valores, ya que existen implicaciones de seguridad significativas para el usuario si todos los valores se recuerdan siempre, independientemente de las preferencias del sitio.

Entonces, en el caso de Chrome, los desarrolladores esencialmente han dicho "dejaremos esto al usuario para que decida en sus preferencias si quiere autocompletetrabajar o no. Si no lo quiere, no lo habilite en su navegador" .

Sin embargo, parece que esto es un poco entusiasta de su parte para mi gusto, pero es así. La especificación también analiza las posibles implicaciones de seguridad de tal movimiento:

La palabra clave "off" indica que los datos de entrada del control son particularmente sensibles (por ejemplo, el código de activación para un arma nuclear); o que es un valor que nunca se reutilizará (por ejemplo, una clave única para un inicio de sesión bancario) y, por lo tanto, el usuario tendrá que ingresar explícitamente los datos cada vez, en lugar de poder confiar en el UA para completar previamente el valor para él; o que el documento proporciona su propio mecanismo de autocompletado y no desea que el agente de usuario proporcione valores de autocompletado.

Entonces, después de experimentar la misma frustración que todos los demás, encontré una solución que funciona para mí. Es similar en vena a las autocomplete="false"respuestas.

Un artículo de Mozilla habla exactamente de este problema:

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

En algunos casos, el navegador seguirá sugiriendo valores de autocompletado incluso si el atributo autocompletar está desactivado. Este comportamiento inesperado puede ser bastante desconcertante para los desarrolladores. El truco para forzar realmente la no terminación es asignar una cadena aleatoria al atributo

Entonces, el siguiente código debería funcionar:

autocomplete="nope"

Y así debería cada uno de los siguientes:

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

El problema que veo es que el agente del navegador puede ser lo suficientemente inteligente como para aprender el autocompleteatributo y aplicarlo la próxima vez que vea el formulario. Si lo hace, la única forma en que puedo ver para solucionar el problema sería cambiar dinámicamente el autocompletevalor del atributo cuando se genera la página.

Un punto que vale la pena mencionar es que muchos navegadores ignorarán la autocompleteconfiguración de los campos de inicio de sesión (nombre de usuario y contraseña). Como dice el artículo de Mozilla:

Por esta razón, muchos navegadores modernos no admiten autocompletar = "off" para los campos de inicio de sesión.

• Si un sitio establece autocomplete = "off" para un formulario, y el formulario incluye campos de ingreso de nombre de usuario y contraseña, entonces el navegador aún ofrecerá recordar este inicio de sesión, y si el usuario está de acuerdo, el navegador completará automáticamente esos campos la próxima vez que el El usuario visita esta página.
• Si un sitio establece autocomplete = "off" para los campos de ingreso de nombre de usuario y contraseña, entonces el navegador aún ofrecerá recordar este inicio de sesión, y si el usuario está de acuerdo, el navegador completará automáticamente esos campos la próxima vez que visite esta página.

Este es el comportamiento en Firefox (desde la versión 38), Google Chrome (desde la 34) e Internet Explorer (desde la versión 11).

Finalmente, una pequeña información sobre si el atributo pertenece al formelemento o al inputelemento. La especificación nuevamente tiene la respuesta:

Si se omite el atributo de autocompletar, en su lugar se usa el valor predeterminado correspondiente al estado del atributo de autocompletar del propietario del formulario del elemento ("activado" o "desactivado"). Si no hay un propietario del formulario, se usa el valor "on".

Entonces. Ponerlo en el formulario debe aplicarse a todos los campos de entrada. Ponerlo en un elemento individual debe aplicarse solo a ese elemento (incluso si no hay uno en el formulario). Si autocompleteno está configurado en absoluto, su valor predeterminado es on.

Resumen

Para deshabilitar autocompleteen todo el formulario:

<form autocomplete="off" ...>

O si necesita hacerlo dinámicamente:

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

Para deshabilitar autocompleteen un elemento individual (independientemente de que la configuración del formulario esté presente o no)

<input autocomplete="off" ...>

O si necesita hacerlo dinámicamente:

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

Y recuerde que ciertos agentes de usuario pueden anular incluso sus intentos más difíciles de deshabilitar autocomplete.

La solución en este momento es usar type="search". Google no aplica autocompletar a las entradas con un tipo de búsqueda.

Ver: https://twitter.com/Paul_Kinlan/status/596613148985171968

Actualización 04/04/2016: ¡ Parece que esto está solucionado! Ver http://codereview.chromium.org/1473733008

Chrome versión 34 ahora ignora el autocomplete=off, mira esto .

¿Mucha discusión sobre si esto es algo bueno o malo? ¿Cuál es tu opinión?

El navegador no se preocupa por autocompletar = apagado automático o incluso llena las credenciales en el campo de texto incorrecto?

Lo arreglé configurando el campo de contraseña en solo lectura y actívelo cuando el usuario hace clic en él o usa la tecla de tabulación para este campo.

arregle el autocompletado del navegador: solo lectura y establezca escritura en el foco (al hacer clic con el mouse y al pasar por los campos)

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

Actualización: Mobile Safari establece el cursor en el campo, pero no muestra el teclado virtual. New Fix funciona como antes pero maneja el teclado virtual:

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

Demostración en vivo https://jsfiddle.net/danielsuess/n0scguv6/

// UpdateEnd

Por cierto, más información sobre mi observación:

A veces noto este comportamiento extraño en Chrome y Safari, cuando hay campos de contraseña en la misma forma. Supongo que el navegador busca un campo de contraseña para insertar sus credenciales guardadas. Luego, llena automáticamente el nombre de usuario en el campo de entrada de texto similar más cercano, que aparece antes del campo de contraseña en DOM (solo adivinando por observación). Como el navegador es la última instancia y no puede controlarlo, a veces incluso autocompletar = apagado no evitaría completar las credenciales en campos incorrectos, pero no el campo de usuario o apodo.

Puedes usar autocomplete="new-password"

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

Trabaja en:

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

TL; DR: dígale a Chrome que esta es una nueva entrada de contraseña y que no proporcionará las antiguas como sugerencias de autocompletar:

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

autocomplete="off" no funciona debido a una decisión de diseño: mucha investigación muestra que los usuarios tienen contraseñas mucho más largas y difíciles si pueden almacenarlas en un navegador o administrador de contraseñas.

La especificación de autocomplete ha cambiado y ahora admite varios valores para que los formularios de inicio de sesión sean fáciles de completar automáticamente:

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

Si no proporciona estos, Chrome aún intenta adivinar, y cuando lo hace, lo ignora autocomplete="off".

La solución es que autocompletetambién existen valores para los formularios de restablecimiento de contraseñ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>

Puede usar esta autocomplete="new-password"bandera para decirle a Chrome que no adivine la contraseña, incluso si tiene una almacenada para este sitio.

Chrome también puede administrar contraseñas para sitios directamente usando la API de credenciales , que es un estándar y que eventualmente tendrá soporte universal.

He resuelto la lucha interminable con Google Chrome con el uso de caracteres aleatorios. Cuando siempre renderiza autocompletar con una cadena aleatoria, nunca recordará nada.

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

Espero que ayude a otras personas.

Autocomplete="Off" ya no funciona

Intente usar solo una cadena aleatoria en lugar de "Off", por ejemploAutocomplete="NoAutocomplete"

Espero que ayude.

Visto que Chrome ignora autocomplete="off", lo resuelvo de una manera estúpida que está usando "entrada falsa" para engañar a Chrome para llenarlo en lugar de llenar el "real".

Ejemplo:

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

Chrome completará la "entrada falsa" y, cuando se envíe, el servidor tomará el valor de "entrada real".

Estoy publicando esta respuesta para traer una solución actualizada a este problema. Actualmente estoy usando Chrome 49 y ninguna respuesta dada funciona para este. También estoy buscando una solución que funcione con otros navegadores y versiones anteriores.

Pon este código al comienzo de tu formulario

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

Luego, para su campo de contraseña real, use

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

Comente esta respuesta si ya no funciona o si tiene un problema con otro navegador o versión.

Aprobado en:

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

para cualquiera que busque una solución a esto, finalmente lo descubro.

Chrome solo obedece el autocomplete = "off" si la página es HTML5 (estaba usando XHTML).

Convertí mi página a HTML5 y el problema desapareció (facepalm).

Cambie el atributo de tipo de entrada a type="search".

Google no aplica el autocompletado a las entradas con un tipo de búsqueda.

Hasta esta semana, las dos soluciones siguientes parecían funcionar para Chrome, IE y Firefox. Pero con el lanzamiento de Chrome versión 48 (y todavía en 49), ya no funcionan:

1. Lo siguiente en la parte superior del formulario:

<input style="display:none" type="text" name="fakeUsername"/>
<input style="display:none" type="password" name="fakePassword"/>

2. Lo siguiente en el elemento de entrada de contraseña:

   autocompletar = "apagado"

Entonces, para solucionar esto rápidamente, al principio traté de usar un truco importante de configurar inicialmente el elemento de entrada de contraseña en deshabilitado y luego usé setTimeout en la función de documento listo para habilitarlo nuevamente.

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

Pero esto parecía tan loco e hice un poco más de búsqueda y encontré la respuesta de @tibalts en Desactivar el Autocompletado de Chrome . Su respuesta es usar autocomplete = "new-password" en la entrada de contraseñas y esto parece funcionar en todos los navegadores (he mantenido mi solución número 1 arriba en esta etapa).

Aquí está el enlace en la discusión del desarrollador de Google Chrome: https://code.google.com/p/chromium/issues/detail?id=370363#c7

autocomplete=off se ignora en gran medida en los navegadores modernos, principalmente debido a los administradores de contraseñas, etc.

Puede intentar agregar esto autocomplete="new-password", no es totalmente compatible con todos los navegadores, pero funciona en algunos

autocomplete="off"Por lo general funciona, pero no siempre. Depende namedel campo de entrada. Los nombres como "dirección", "correo electrónico", "nombre" se completarán automáticamente (los navegadores creen que ayudan a los usuarios), cuando campos como "código", "pin" no se completarán automáticamente (si autocomplete="off"está configurado)

Mi problema fue que el autocompletado estaba jugando con el asistente de direcciones de Google

Lo arreglé renombrándolo

desde

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

a

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

Probado en cromo 71.

En lugar de autocompletar = "off", use autocomplete = "false" ;)

de: https://stackoverflow.com/a/29582380/75799

No tengo idea de por qué esto funcionó en mi caso, pero en Chrome utilicé autocomplete="none"y Chrome dejó de sugerir direcciones para mi campo de texto.

A partir de Chrome 42, ninguna de las soluciones / hacks en este hilo (a partir de 2015-05-21T12:50:23+00:00) funciona para deshabilitar el autocompletado para un campo individual o el formulario completo.

EDITAR: descubrí que en realidad solo necesita insertar un campo de correo electrónico ficticio en su formulario (puede ocultarlo display: none) antes de los otros campos para evitar el autocompletado. Supongo que Chrome almacena algún tipo de firma de formulario con cada campo autocompletado e incluir otro campo de correo electrónico corrompe esta firma y evita el autocompletado.

<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 buena noticia es que, dado que la "firma del formulario" está dañada por esto, ninguno de los campos se completa automáticamente, por lo que no se necesita JS para borrar los campos falsos antes del envío.

Vieja respuesta:

Lo único que he encontrado que sigue siendo viable es insertar dos campos ficticios de tipo correo electrónico y contraseña antes de los campos reales. Puede configurarlos display: nonepara ocultarlos (no es lo suficientemente inteligente como para ignorar esos campos):

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

Desafortunadamente, los campos deben estar dentro de su formulario (de lo contrario, ambos conjuntos de entradas se rellenan automáticamente). Por lo tanto, para que los campos falsos se ignoren realmente, necesitará algunos JS para ejecutar en el envío del formulario para borrarlos:

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

Observe desde arriba que borrar el valor con Javascript funciona para anular el autocompletado. Entonces, si es aceptable perder el comportamiento adecuado con JS deshabilitado, puede simplificar todo esto con un "polyfill" de JS autocompletado para 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);

Tuve un problema similar en el que el campo de entrada tomó un nombre o un correo electrónico. Configuré autocomplete = "off" pero Chrome aún forzó sugerencias. Resulta que fue porque el texto del marcador de posición tenía las palabras "nombre" y "correo electrónico".

Por ejemplo

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

Lo evité poniendo un espacio de ancho cero en las palabras en el marcador de posición. No más Chrome autocompletar.

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

En Chrome 48+ usa esta solución:

1. Poner campos falsos antes que campos reales:

   <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. Ocultar campos falsos:

   .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. ¡Lo hiciste!

También esto funcionará para versiones anteriores.

Después del Chrome v. 34, la configuración autocomplete="off"en la <form>etiqueta no funciona

Hice los cambios para evitar este comportamiento molesto:

1. Eliminar el namey el idde la entrada de contraseña
2. Ponga una clase en la entrada (ej .: passwordInput)

(Hasta ahora, Chrome no pondrá la contraseña guardada en la entrada, pero el formulario ahora está roto)

Finalmente, para que el formulario funcione, ponga este código en ejecución cuando el usuario haga clic en el botón de envío, o cuando desee activar el envío del formulario:

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

En mi caso, solía tener id="password" name="password"la entrada de contraseña, así que las puse antes de activar la submisión.

Después de haber probado todas las soluciones, esto es lo que parece estar funcionando para la versión de Chrome: 45, con un formulario que tiene un campo de contraseña:

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

Acabo de actualizar a Chrome 49 y la solución de Diogo Cid ya no funciona.

Hice una solución diferente ocultando y eliminando los campos en tiempo de ejecución después de cargar la página.

Chrome ahora ignora la solución original que aplica las credenciales al primer campo mostrado type="password" y su type="text"campo anterior , por lo que he ocultado ambos campos usando 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();
    });
});

Sé que puede parecer no muy elegante, pero funciona.

Encontré que esta solución es la más adecuada:

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

Debe cargarse después de dom ready, o después de que se procese el formulario.

Si bien estoy de acuerdo con que la función de autocompletar debería ser una opción del usuario, hay ocasiones en que Chrome es demasiado entusiasta (otros navegadores también pueden serlo). Por ejemplo, un campo de contraseña con un nombre diferente todavía se llena automáticamente con una contraseña guardada y el campo anterior se completa con el nombre de usuario. Esto apesta particularmente cuando el formulario es un formulario de administración de usuarios para una aplicación web y no desea que el autocompletado lo complete con sus propias credenciales.

Chrome ignora completamente autocompletar = "off" ahora. Si bien los hacks JS pueden funcionar, encontré una forma simple que funciona al momento de escribir:

Establezca el valor del campo de contraseña en el carácter de control 8 ( "\x08"en PHP o en HTML). Esto impide que Chrome complete automáticamente el campo porque tiene un valor, pero no se ingresa ningún valor real porque este es el carácter de retroceso.

Sí, esto sigue siendo un truco, pero funciona para mí. YMMV.