Utwórz stronę tak, aby przeglądarka nie buforowała / zachowywała wartości wejściowych

116

Większość przeglądarek buforuje wartości wejściowe formularzy. Kiedy więc użytkownik odświeża stronę, dane wejściowe mają te same wartości.

Oto mój problem. Kiedy użytkownik kliknie przycisk Zapisz , serwer sprawdza poprawność danych POST (np. Sprawdzone produkty), a jeśli nie są prawidłowe, odsyła je z powrotem do przeglądarki. Jednak, jak wspomniano powyżej, nawet jeśli serwer wyczyści wybór niektórych wartości, nadal mogą one zostać wybrane z powodu pamięci podręcznej przeglądarki!

Moje dane mają niewidoczne pola wyboru (do momentu wybrania elementu nadrzędnego), więc użytkownik może nawet nie być świadomy, że jakaś poprzednia wartość jest nadal zaznaczona, aż do ponownego kliknięcia Zapisz i otrzymania komunikatu o błędzie - nawet jeśli użytkownik uważa, że ​​tak nie jest. Co jest irytujące.

Można to rozwiązać, wykonując Ctrl+ F5, ale nie jest to nawet rozwiązanie. Czy istnieje automatyczny / programowy sposób, aby powiedzieć przeglądarce, aby nie buforowała danych wejściowych formularza na jakimś formularzu / stronie?

html browser forms browser-cache królowa3
źródło
1
Czy jest <form autocomplete="off"...jakaś opcja dla Ciebie? Czy ten problem występuje we wszystkich przeglądarkach, czy tylko w jednej w szczególności?
David Kolar,
Czy istnieje sposób, aby odpowiedzieć na to pytanie w odniesieniu do <select>list rozwijanych? Mam listę i zdefiniowałem selectedwybór, ale odświeżenie strony zachowuje wcześniej wybrane opcje.
Martin
Chcę osiągnąć coś odwrotnego - zachowaj wartości wejściowe każdej strony na przycisku Wstecz (kliknij dwukrotnie wstecz, aby odpowiednio uzyskać dane wejściowe). Istnieje wiele przykładów użycia dużej ilości kodu JS (który tak naprawdę nie działa w IMHO), ale - czy jest prostszy sposób? Próbowałem autocomplete = "on" zarówno w formularzu, jak i polach wejściowych - nie działa. Przeglądarka to Chrome.
Dmitry z

Odpowiedzi:

197

Czy jawnie ustawiasz wartości jako puste? Na przykład:

<input type="text" name="textfield" value="">

To powinno powstrzymać przeglądarki przed umieszczaniem danych tam, gdzie nie powinny. Alternatywnie możesz dodać autocompleteatrybut do tagu formularza:

<form autocomplete="off" ...></form>
Niezadowolony Kozioł
źródło
1
Mówię o polach wyboru, więc nie mogę ustawić wartości na „”. I czy wyłączenie autouzupełniania oznacza, że ​​nie należy przechowywać wartości wejściowych formularza, „gdy użytkownik naciśnie klawisz F5”, a nie tylko „w przypadku rozwijanej listy autouzupełniania”?
królowa 3
2
Według developer.mozilla.org/en/How_to_Turn_Off_Form_Autocompletion , autcompletion = off wpływa na "buforowanie historii sesji", przynajmniej w Gecko. Sprawdzę, czy działa to, czego potrzebuję.
królowa 3
1
@ queen3: Tak, pola wyboru są problemem, ponieważ nie ma sposobu, aby wyraźnie powiedzieć „nie zaznaczono”. Jeśli nadal masz problemy, możesz spróbować checked="false", może to działać w niektórych przeglądarkach. Inną alternatywą jest użycie Javascript / jQuery do jawnego odznaczenia wszystkich pól wyboru podczas ładowania strony.
DisgruntledGoat
1
@ queen3, masz na myśli „autocomplete = off” not „autocompletion = off”
Matt Baker,
2
Wszystkie odpowiedzi i sugestie nie działały w moim przypadku. Korzystanie z Chrome i rozwijanie .net
hakan
45

Z odniesienia do przepełnienia stosu

To nie zadziałało z wartością = "", jeśli przeglądarka już zapisała wartość, więc powinieneś dodać.

Dla tagu wejściowego istnieje atrybut autouzupełniania, który możesz ustawić:

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

Możesz użyć autouzupełniania również dla formularza.

shareef
źródło
9
W Chrome wygląda na to, że autocomplete="off"nie działa, gdy jest używany na poszczególnych elementach formularza - nawet z valueatrybutem jawnie ustawionym jako pusty, a podczas wysyłania Cache-Control: Must-Revalidatenagłówka nie miało to żadnego efektu. Musiałem zastosować autocomplete="off"atrybut do samego <form>elementu, aby powstrzymać to zachowanie w Chrome.
mindplay.dk
zrobiłem autocomplete = „off” w formularzu, ale to nie zadziałało
Kingsley Simon
Potrzebuję więcej informacji @KingsleySimon jak przeglądarka, a możesz mieć pewne ustawienia w przeglądarce, które uniemożliwiają prawidłowe zachowanie
shareef
1
wygląda na to, że zmieniło się zachowanie przeglądarki: developer.mozilla.org/en-US/docs/Web/Security/ ...
david
i zwróć uwagę na prawidłowy formularz HTML. i na przykład nie ma formy wewnątrz innego itp.
shareef
10

Innym podejściem byłoby zresetowanie formularza za pomocą JavaScript bezpośrednio po formularzu w kodzie HTML:

<form id="myForm">
  <input type="text" value="" name="myTextInput" />
</form>

<script type="text/javascript">
  document.getElementById("myForm").reset();
</script>
pmko
źródło
8

Zasadniczo istnieją dwa sposoby wyczyszczenia pamięci podręcznej:

<form autocomplete="off"></form>

lub

$('#Textfiledid').attr('autocomplete', 'off');
Anand Dwivedi
źródło
6

To działało dla mnie w nowszych przeglądarkach:

autocomplete="new-password"
erikrunia
źródło