Automatisch aanvullen uit vs onwaar?

Onlangs ben ik een probleem tegengekomen waarbij ik automatisch aanvullen in alle browsers wilde uitschakelen.

Chrome heeft een nieuwe functie in instellingen waar je een kaartnummer kunt toevoegen. En de vereiste was om dat ook uit te schakelen.

Wat in alle browsers werkte, was om dit autocomplete=falseop formulierniveau te doen.

Maar dit is niet in overeenstemming met de w3-regels, waar ze afdwingen om autocomplete=off|onte hebben.

Kan iemand me uitleggen waarom falsein alle browsers werkt?

zelfs ie8, alle firefox, safari etc., maar het voldoet niet.


Antwoord 1, autoriteit 100%

Je hebt gelijk. Als u het kenmerk automatisch aanvullen instelt op ‘uit’, wordt automatisch aanvullen van Chrome niet uitgeschakeld in recentere versies van Chrome.

U kunt echter automatisch aanvullen instellen op alles behalve “aan” of “uit” (“false”, “true”, “nofill”) en het automatisch aanvullen van Chrome wordt uitgeschakeld.

Dit gedrag komt waarschijnlijk omdat het kenmerk autocomplete een “aan” of “uit” waarde verwacht en niets doet als u het iets anders geeft. Dus als je het iets anders geeft dan die waarden, valt automatisch aanvullen uit elkaar / doet niets.

Met de huidige versie van Chrome is gebleken dat het instellen van het autocomplete-kenmerk op “uit” nu echt werkt.

Ik heb ook ontdekt dat dit alleen werkt als u het kenmerk autocomplete instelt in elke <input>-tag van het formulier.

Er is gereageerd op deze dubbelzinnigheid in de Chromium-buglijsten hier.

Disclaimer: dit bleek waar te zijn in Chrome-versie 47.0.2526.106 (64-bits)


Antwoord 2, autoriteit 53%

Na Chrome-versie 72.XX:

Chrome negeert autocomplete="off"autocomplete="no-fill"of autocomplete="randomText"zowel op veld- als formulierniveau .

De enige optie die ik heb gevonden is om een ​​tijdelijke oplossing te volgen door Chrome te misleiden om het automatisch aanvullen in een dummy tekstvak en wachtwoord in te vullen en ze vervolgens te verbergen voor de gebruikersweergave.

Onthoud dat de oude methode met style="display: hidden"of style="visibility: hidden"ook wordt genegeerd.

FIX:

Maak dus een DIVmet height: 0px;overflow:hiddendie de HTML-elementen nog steeds zal weergeven, maar ze voor de gebruikersweergave verbergt.

Voorbeeldcode:

<div style="overflow: hidden; height: 0px;background: transparent;" data-description="dummyPanel for Chrome auto-fill issue">
        <input type="text" style="height:0;background: transparent; color: transparent;border: none;" data-description="dummyUsername"></input>
        <input type="password" style="height:0;background: transparent; color: transparent;border: none;" data-description="dummyPassword"></input>
</div>

Voeg de bovenstaande div toe aan het HTML-formulier en het zou moeten werken!


Antwoord 3, autoriteit 37%

Gebruik autocomplete=”my-field-name”in plaats van autocomplete=”off”. Wees voorzichtig met hoe je het noemt, aangezien sommige waarden nog steeds worden herkend, zoals autocomplete=”country”. Ik ontdekte ook dat het gebruik van het placeholder-attribuut in sommige lastige scenario’s hielp.

Voorbeeld:
<input type="text" name="field1" autocomplete="my-field-name1" placeholder="Enter your name">

Chrome is onlangs gestopt met het gebruik van autocomplete=”off”omdat ze dachten dat het te veel werd gebruikt door ontwikkelaars die niet lang nadachten over het al dan niet automatisch aanvullen van het formulier. Dus hebben ze de oude methode verwijderd en ons een nieuwe laten gebruiken om ervoor te zorgen dat we echt niet willen dat deze automatisch wordt aangevuld.


Antwoord 4, autoriteit 18%

$("#selector").attr("autocomplete", "randomString");  

Dit heeft altijd betrouwbaar gewerkt voor mij.

Opmerking: ik heb een beroep gedaan op deze LOC op modale showgebeurtenis.


Antwoord 5, autoriteit 18%

Als iemand dit leest en problemen heeft met het uitschakelen van automatisch aanvullen op gebruikersnaam- en wachtwoordvelden voor nieuwe gebruikers, merkte ik dat het instellen van autocomplete=”new-password” werkt in Chrome 77. Het verhinderde ook dat het gebruikersnaamveld automatisch werd ingevuld.

>

Ref: https://html.spec.whatwg. org/multipage/form-control-infrastructure.html#autofill


Antwoord 6, autoriteit 16%

Waarde automatisch aanvullen, anders dan uit en vals werken.

autoComplete="nope"
autoComplete="foo"
autoComplete="boo"
autoComplete="anythingGoesHere"

Getest op chrome 76 en reageren 16.9.0


Antwoord 7, autoriteit 8%

Het is 2020 en als iemand er nog steeds mee worstelt zoals ik deed. De enige oplossing die voor mij werkte, is als volgt: door automatisch aanvullen in te stellen op een willekeurige tekenreeks, wordt automatisch aanvullen uitgeschakeld, maar het werkt alleen als het is voltooid nadat de pagina is geladen. Als die willekeurige reeks als standaardwaarde wordt behouden, zet Chrome deze irritant weer uit. Dus wat voor mij werkte, is (ik gebruik jQuery) op een document klaar evenement, ik heb het volgende toegevoegd,

window.setTimeout(function () {
        $('your-selector').attr('autocomplete', 'google-stop-doing-this');
}, 1000);

Zonder de time-out zet Chrome de functie nog steeds op de een of andere manier terug naar uit.


Antwoord 8, autoriteit 5%

Als er een “wachtwoordtype-invoer” in uw formulier staat, kunt u dit proberen;

<input type="password" ..... autocomplete="new-password" />

Antwoord 9, autoriteit 3%

autocomplete=”none”werkt perfect voor angularjs en angular 7


Antwoord 10

Het autocomplete-kenmerk instellen op true|false of aan|uit werkt niet onder alle omstandigheden. Zelfs als je probeert om placeholder te gebruiken, zal het ook niet werken.

Ik heb geprobeerd autocomplete=”no” te gebruiken om de plug-in voor automatisch aanvullen van Chrome te vermijden.

Deze autocomplete=”no” moet binnen een invoerregel worden geschreven, bijvoorbeeld


Antwoord 11

Hoewel het misschien niet de meest elegante oplossing is, werkte dit voor mij:

JQuery-versie:

$("input:-internal-autofill-selected").val('');

VanillaJS-versie:

document.querySelectorAll("input:-internal-autofill-selected").forEach(function(item){item.value = '';})

Als Chrome een invoerveld automatisch invult, krijgen de velden een intern pseudo-element -internal-autofill-selected(waardoor de invoer ook een lichtblauwe achtergrond krijgt). We kunnen dit pseudo-element als selector gebruiken om de Chrome autocomplete/autofill ongedaan te maken.

Houd er rekening mee dat het mogelijk is (afhankelijk van uw implementatie) om uw code in een time-out te plaatsen, aangezien Chrome automatisch wordt ingevuld nadat de DOM is geladen.


Antwoord 12

Probeer dit via invoertag:

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

Voorbeeld:

<input type="text" class="form-control" autocomplete="false" readonly onfocus="this.removeAttribute('readonly');">

Antwoord 13

Niet perfecte maar werkende oplossing met jQuery

$(document).ready(function(){
   if (navigator.userAgent.indexOf("Chrome") != -1) {
      $("#selector").attr("autocomplete", "nope"); // to disable auto complete on chrome
   }
})

Antwoord 14

autocomplete="one-time-code"

werkte voor mij.


Antwoord 15

Als aanvulling op het antwoord van @camiblanch

Het toevoegen van autocomplete="off"is niet voldoende.
Wijzig invoertypekenmerk in type="search".
Google past automatisch invullen niet toe op invoer met een type zoekopdracht.

Other episodes