Je suis tombé sur ce problème à plusieurs reprises ces derniers temps, où Chrome ignore autocomplete="false" et autocomplete="off" . Il ignorera même maintenant autocomplete="whatever" ou tout ce que vous faites pour le tromper, si quelqu'un a déjà soumis un formulaire avec ce "hack" aléatoire.
En essayant de résoudre ce problème, je suis tombé sur cette question StackOverflow , qui ne résout pas le problème si vous avez déjà soumis un formulaire contenant ce champ.
EDIT: Ceci n'est PAS pour les champs de mot de passe.
5 Réponses :
La réponse? Modifiez dynamiquement le name et les valeurs de autocomplete - autocomplete lors du chargement de la page. Vous pouvez le faire via PHP, JS, tout ce que vous utilisez. Dans mon cas, j'ai fait cela en PHP en ajoutant un horodatage (en secondes) au name et aux valeurs de autocomplete - autocomplete :
if ($('#example').length) {
var dynamicName = $('#example').attr('name');
var dynamicCounter = 0;
setInterval(function(){
var dynamicVal = dynamicName + dynamicCounter;
$('#example').attr('autocomplete', dynamicVal).attr('name', dynamicVal);
dynamicCounter += 1;
}, 2500);
}
qui devient:
<input type="text" id="example" name="whatever1525376494" autocomplete="whatever1525376494">
Cela garantira que Chrome ne fera pas de suggestion automatique à chaque nouveau chargement de page.
Dans mon cas, cela ne suffisait pas, car je soumets le même formulaire plusieurs fois sans recharger la page, et la plupart des utilisateurs feront de même. Et cela signifie que je dois changer le nom et les valeurs de saisie semi-automatique après chaque soumission de formulaire.
Pour résoudre cela, j'ai ajouté ce bit de JS pour le contourner. Il ajoute un entier incrémentiel à la fin de ces valeurs toutes les 2,5 secondes, ce qui les couvre.
<input type="text" id="example" name="whatever<?php echo time(); ?>" autocomplete="whatever<?php echo time(); ?>">
J'espère que ça t'as aidé!
voici la solution JS qui fonctionne à ce stade pour moi:
<input name="name" type="text"
onfocus="this.__name = this.getAttribute('name'); this.removeAttribute('name')"
onblur="this.setAttribute('name',this.__name)"
>
Le nom d'entrée ci - dessus stocke le code js à ce .__ nom et supprime le nom onfocus plus tard onblur nom est rétablie si les formes peuvent fonctionner comme prévu, mais le chrome ne autofill.
J'ai déjà répondu à ma propre question et cela explique mieux que vous ne l'avez fait, même si votre hack est bon.
En fait, chrome ignorait même la saisie semi-automatique = "peu importe" au moment où j'ai écrit le hack JS mentionné :) ... donc si quelqu'un d'autre est aussi malchanceux que moi, ce hack JS pourrait aider.
Essayez de rendre votre entrée en lecture seule, activez-la après le focus
<input readonly="readonly" onfocus="this.removeAttribute('readonly');" type="text" value="test">
Je n'aime pas du tout cette solution. Cela ne semble pas suffisamment infaillible ou pérenne. Ma propre réponse est plus solide.
autocomplete = "new-password" et définir l'attribut d'espace réservé avec du texte fonctionne pour moi.
<input name="name1" placeholder="Nº" type="text" autocomplete="new-password" />
Lisez la note en bas avant d'utiliser cette méthode
Après avoir lutté pendant longtemps, je l'ai fait fonctionner de manière fiable de cette façon:
Il est important que votre type d'entrée soit «texte» !!
définir une classe css
<form autocomplete="off">
<input
type = "text" // <----This is important
class = "hidden-password"
/>
</form>
Ensuite, dans votre formulaire, désactivez la saisie semi-automatique, input types = 'text' et ajoutez la classe à l'entrée.
input.hidden-password {
-webkit-text-security: disc;
}
Allez Google, prenons le contrôle de nos entrées! Mon client exige que les mots de passe soient changés très souvent et le remplissage automatique EST UN GRAND NON NON!
REMARQUE IMPORTANTE Ne l'utilisez pas pour la connexion ou tout autre endroit où la sécurité est requise. Je l'ai utilisé pour un formulaire dans mon application où l'utilisateur était déjà authentifié et la sécurité n'était pas requise.
Ca ne fonctionne pas....
Cela a très bien fonctionné pour moi la semaine dernière. Avez-vous importé votre fichier css et appliqué la classe à votre entrée?
@ JosephSible-ReinstateMonica Cela ne brise pas les gestionnaires de mots de passe, ce n'est pas du tout pour un champ de mot de passe. Ce champ ne peut pas être rempli automatiquement dans mon application Web. Pas une option. Chrome doit commencer à respecter les directives de la spécification HTML. Ce n'est PAS pour les champs de mot de passe. En outre, les champs de mot de passe ont le type = "mot de passe" défini sur eux, ce qui rendrait ce hack inefficace.
Il est important de savoir que si vous désactivez la saisie semi-automatique, vous enfreignez la règle 1.3.5: Identifier le but de l'entrée dans WCAG 2.1. Si vous créez un site Web qui doit suivre WCAG, vous devez utiliser la saisie semi-automatique avec remplissage automatique. w3.org/WAI/WCAG21/Understanding/identify-input-purpose.html
@Stuart ce n'est pas à un navigateur de dicter comment le concepteur utilise un champ. Si l'option permettant de le désactiver se trouve dans l'ensemble d'outils, cela devrait fonctionner et le navigateur devrait obéir à la directive. Il ne devrait pas alors créer ses propres règles comme une sorte de dictateur omnipotent.
Ce n'est pas ce que je dis. Il appartient au concepteur de sites Web de se conformer aux principes de conception du Web. Et il devrait être que le concepteur aide, pas gêner l'utilisateur de leurs pages.
Il semble que la réponse la plus récente à ce problème soit là: stackoverflow.com/questions/15738259/...