Dlaczego pole wyboru pozostaje zaznaczone podczas ponownego ładowania strony?


82

Przeładowuję stronę internetową, która zawiera następujący kod:

<label for="showimage">Show Image</label>
<input id="showimage" name="showimage" type="checkbox" value="1" />

Mimo że kod HTML pozostaje wysyłany do przeglądarki przy każdym ponownym załadowaniu strony, to pole wyboru zawsze przyjmuje zaznaczoną wartość po wykonaniu ponownego załadowania. Innymi słowy, jeśli użytkownik zaznaczy pole wyboru i załaduje ponownie, pole wyboru jest nadal zaznaczone.

Czy dzieje się tutaj jakieś buforowanie?

Edycja : Wypróbowałem poniższe rozwiązanie Gordona Bella i stwierdziłem, że nadal ma to miejsce, nawet po usunięciu wartości = „1”. Coś jeszcze może mi brakować?

<label for="showimage">Show Image</label> 
<input id="showimage" name="showimage" type="checkbox" /> 

Odpowiedzi:


38

Tak, uważam, że to buforowanie. Widzę to zachowanie na przykład w Firefoksie (nie Safari, bo to jest warte :)).

możesz ponownie załadować stronę i ominąć pamięć podręczną (w przeglądarce Firefox) za pomocą CTRL- SHIFT- Ra zobaczysz, że wartość kontrolna nie jest przenoszona (normalna CTRL- jednak Rpobierze informacje z pamięci podręcznej)

edycja : udało mi się wyłączyć tę stronę serwera w przeglądarce Firefox, ustawiając nagłówek kontroli pamięci podręcznej:

Cache-Control: no-store

wydaje się, że wyłącza to funkcję „zapamiętuj wartości formularzy” przeglądarki Firefox


Tak, CTRL-SHIFT-R powoduje zresetowanie pól wyboru. Czy istnieje sposób, aby zapobiec buforowaniu tego?
Tylko do odczytu

nie sądzę (przynajmniej nie od strony serwera). Firefox jest bardzo agresywny w buforowaniu rzeczy. udało mi się tylko sprawić, by przestał niezawodnie buforować w takich sytuacjach po stronie klienta
Owen

2
pobiera wartości ze swojej pamięci podręcznej, a więc buforuje. chyba że źle zrozumiałem, co próbujesz powiedzieć.
Owen

1
Agresywne buforowanie Firefoksa jest głównym problemem PITA i zawsze mnie zaskakuje, gdy rozwijam się przeciwko niemu. Nie próbowałem wcześniej nagłówka Cache-Control, ale jeśli działa, przepełnienie stosu po prostu uzasadnia czas, który tutaj spędzam.
Cruachan

1
Wartości nie pochodzą z „pamięci podręcznej”, jak w pobranym magazynie plików Firefoksa. np .: jeśli opuścisz stronę, a następnie podążasz za tym samym adresem URL, strona zostanie zapisana w pamięci podręcznej, ale wartości nie. Łamiąc pamięć podręczną, możesz wymusić twarde przeładowanie, ale to tylko zbieg okoliczności, że to również wyłącza tę funkcję.
bobince

166

Dodaj autocomplete="off"do elementu formularza na stronie. Wadą jest to, że to nie jest prawidłowy XHTML, ale rozwiązuje problem bez zawiłego javascript.


1
U mnie działa, gdy nagłówek cache-control nie działa.
Lajos Meszaros

7
Z tego, co czytam , faktycznie jest to poprawne w HTML5. (Głosowałem za poprzednim komentarzem, zanim przeczytałem więcej na ten temat.) Więc używaj autouzupełniania do treści twojego serca na polach wyboru, jeśli używasz HTML5.
EF0

3
Ponad 10 lat później. Ta odpowiedź uratowała mi ból głowy!
Daan van den Bergh

33

set autocomplete = "off" z js również działa dobrze.

na przykład używając jquery:

$(":checkbox").attr("autocomplete", "off");

Dzięki, to mi bardzo pomogło. :)
Lyubomyr Shaydariv

1
Odkryłem, że potrzebujesz, $("#formId").attr("autocomplete", "off")gdzie #formIdjest identyfikator twojego formularza.
Dan Diplo,

@DanDiplo jest wiele sytuacji, w których używamy pola wyboru bez formularza, dlatego jego zastosowanie jest nielogiczne („#formId”). Attr („autocomplete”, „off”)
Clain Dsilva

2
@ClainDsilva Tylko dlatego, że mogą korzystać z wyboru poza formą nic nie znaczy powiedziałem jest nielogiczne. Możesz twierdzić, że nie jest to całkowicie kompleksowe (chociaż działa w większości scenariuszy), ale stwierdzenie, że nie jest logiczne, jest dziwne, biorąc pod uwagę, że działa.
Dan Diplo,

@DanDiplo, kiedy możemy wyłączyć autouzupełnianie tylko w polu wyboru, działa to dobrze w ten sposób, zgadzam się, że twoje rozwiązanie działa, ale dotyczy również wszystkich elementów w polu formularza. Może to jednak nie być zamierzone zachowanie. Pytanie zostało zawężone do samego pola wyboru, a nie do całego formularza. Z całym szacunkiem chcę tylko znaleźć najlepsze rozwiązanie dostosowane do pytania. W tym kontekście wyłączenie autouzupełniania dla całego formularza nie jest właściwe.
Clain Dsilva

1

To fajna funkcja Firefoksa: jeśli coś wpiszesz, ale ponownie załadujesz stronę, tekst pozostanie w polu tekstowym. To samo dotyczy innych wybranych ustawień.

Niestety, to nie działa w SO (prawdopodobnie resetowane przez JS) i głupszych przeglądarkach, takich jak IE ...

Co sugeruje rozwiązanie: jeśli naprawdę musisz to zrobić, zresetuj formularz za pomocą JS. form.reset () może wykonać zadanie (działa jak przycisk Resetuj).


1
Wydaje się trochę hacky lub jak strzelanie z armaty do wróbla.
Lajos Meszaros

@ MészárosLajos Co to jest hacky / overkill i dlaczego tak to postrzegasz? Czy widzisz coś prostszego?
PhiLho,

Co jeśli chcesz, aby formularz był resetowany tylko częściowo? Osobiście chcę wyłączyć pamięć podręczną danych wejściowych tylko dla pól wyboru, ale nie dla pól tekstowych. Całkowicie się z tobą zgadzam, że jest to dobra cecha Firefoksa, ale nie dla niestandardowych przycisków z dwoma stanami, które są w zasadzie przeprojektowanymi polami wyboru. Inną rzeczą jest, po co używać javascript, skoro można po prostu użyć właściwości html, aby zapobiec takiemu zachowaniu? I tak, wiem, „autocomplete = off” unieważnia kod HTML, ale strona nadal działa.
Lajos Meszaros

3
„to fajna funkcja Firefoksa”: jeśli klikniesz filtrowanie pól wyboru na stronie wyników wyszukiwania, a następnie załadujesz ją ponownie, zaznaczone filtry nie będą miały sensu przy wyświetlonym zestawie danych. - powiedzmy, że jest to poważna PITA, jak wspomniano wcześniej.
Sharky,

Nigdy nie nazwałbym tego fajną funkcją ... tak, to pomaga, gdy wpisujesz dużo tekstu, a następnie musisz odświeżyć stronę, ale jeśli tworzysz interfejs użytkownika, jest to dalekie od ładnego funkcja.
userfuser

1

To jest stare pytanie, ale nadal aktywny problem dla przeglądarki Firefox. Żadna z odpowiedzi Próbowałem rozwiązać go, ale co zrobił go rozwiązać dla mnie było po prostu tak:

    document.getElementById('formId').reset();

To po prostu resetuje formularz do domyślnych opcji za każdym razem, gdy strona się ładuje. Nie jest to idealne rozwiązanie, ponieważ tracisz szczegółową kontrolę, ale to jedyna rzecz, która rozwiązała ten problem.


0

lub zamiast f5 naciśnij enter na pasku adresu :)


1
Albo raczej zasugeruj użytkownikowi, aby to zrobił (to jest pytanie programisty).
Pan TA

Nie możemy naprawdę oczekiwać, że użytkownicy zawsze odświeżają stronę za pomocą Crtl + Shift + R, prawda?
Lajos Meszaros

0

Może to być spowodowane buforowaniem przeglądarki - bardzo przydatne w przypadku statycznych witryn internetowych, które nie są zbyt często zmieniane, bardzo niekorzystne w przypadku dynamicznych aplikacji internetowych.
Spróbuj z tymi dwoma metatagami w sekcji głównej strony. Drugi metatag jest przeznaczony dla starszych przeglądarek (IE5), które nie rozpoznają metatagu „no-cache” i chociaż są różne, dają ten sam wynik: każde żądanie trafia do serwera.

<META HTTP-EQUIV="Pragma" CONTENT="no-cache"> 
<META HTTP-EQUIV="Expires" CONTENT="-1">

Czy naprawdę zależy nam na takich starych przeglądarkach, jak IE5? Nawiasem mówiąc, wysyłanie nagłówków za pomocą PHP wydaje się nieco lepsze, ponieważ używasz mniej metatagów w <head>
Lajos Meszaros

2
Jego odpowiedź była w 2008 r., Komentarz @ MészárosLajos był w 2014 r. Wtedy tak, to miało znaczenie.
Duniyadnd


0

publiczny pomysł rozwiązania tego problemu

utwórz formularz i przycisk resetowania

<form>
<checkbox>
<reset>
</form>

$(reset).trigger("click");//to clear the cache and input 
$(checkbox).trigger("click");//to mark checkbox
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.