Tworzę aplikację internetową do zarządzania SKUS produktu. Jedną z nich jest powiązanie kodów SKU z nazwami produktów. W każdym rzędzie tabeli wymieniam SKU i wyświetlaję a<select> pudełko z nazwami produktów. Produkt, który jest aktualnie powiązany z tym SKU w bazie danych, ma taki atrybutselected="selected". Można to zmienić i zaktualizować za pomocą AJAX.

Istniejąlos produktu<option>s - dokładniej 103 - i ta lista jest powtarzana w<select> w każdym rzędzie.

Z innego wpisu na stronie używam żądań jQuery AJAX w celu dodania nowych skojarzeń SKU / produktów i aby było jasne, że są dodawane natychmiast, wstawiam je doTop stołu z małym efektem podświetlenia. Wraz ze wzrostem liczby jednostek SKU po 10, jeśli odświeżę stronę (która ładuje wszystko z bazy danych uporządkowanej według nazwy produktu), Firefox zacznie wyświetlać niektóre nieprawidłowe opcje wybrane domyślnie. Nie jest zgodne co do tego, która nieprawidłowa opcja jest wyświetlana, ale wydaje się, że miesza opcje istniejące przed przeładowaniem strony.

Jeśli sprawdzę<select> przy użyciu Firebugselect="selected" jest prawidłowy<option> etykietka. Odświeżenie strony (lub pozostawienie i wpisanie adresu URL tej strony z powrotem w celu powrotu) nie powoduje poprawnego wyświetlenia strony, aletwarde odświeżanie (Ctrl + F5) tak.

Zarówno Chrome, jak i IE7 wyświetlają to poprawnie.

Moja teoria jest taka, że ​​jest to wynik błędnej strategii pamięci podręcznej Firefoksa. Czy to brzmi dobrze? Czy mogę w swoim kodzie powiedzieć coś „jeśli ta strona jest odświeżona, to odśwież ją - przeładuj wszystko od nowa?”

Aktualizacja

Aby rozwiązać ten problem, zmieniłem strategie.

Wcześniej umieściłem<select> z długą listą<option>s w każdym wierszu tabeli, z bieżącą wartością ustawioną jako domyślnąTeraz umieściłem bieżącą wartość w a<span>. Jeśli użytkownik kliknie przycisk „Zmień”, zastępuję go<span> z<select>, a przycisk „Zmień” staje się przyciskiem „Potwierdź”. Jeśli zmienią opcje i klikną potwierdzić, AJAX aktualizuje bazę danych, the i the<select> wraca do bycia a<span>, tym razem z nową wartością.

Ma to dwie zalety:

Naprawia opisany powyżej błądTo wymagadaleko mniej elementów DOM na stronie (wszystkie zbędne<option>s)