Firefox가 올바른 기본 선택 옵션을 표시하지 않는 이유는 무엇입니까?

Firefox가 올바른 기본 선택 옵션을 표시하지 않는 이유는 무엇입니까?

---

SKUS 제품을 관리하는 웹앱을 만들고 있습니다. 그 중 하나는 SKU를 제품 이름과 연결하는 것입니다. 표의 각 행에 SKU를 나열하고 <select>제품 이름이 있는 상자를 표시 합니다. 현재 데이터베이스에서 해당 SKU와 연결된 제품에는 selected="selected". 이것은 AJAX를 통해 변경 및 업데이트 할 수 있습니다.

거기에있는 많은 제품의 <option>정확한 수 103 - -들이 목록은 반복되는 <select>각 행에.

페이지의 다른 입력에서 새 SKU / 제품 연결을 추가하기 위해 jQuery AJAX 요청을 사용하고 있으며, 즉시 추가되었음을 명확히하기 위해 약간의 하이라이트 효과를 사용하여 테이블 상단 에 삽입합니다 . SKU 수가 10 개 이상 증가함에 따라 페이지를 새로 고치면 (제품 이름별로 정렬 된 데이터베이스에서 모든 것을 다시로드 함) Firefox는 기본적으로 선택된 일부 잘못된 옵션을 표시하기 시작합니다. 어떤 잘못된 옵션이 표시되는지는 일치하지 않지만 페이지를 다시로드하기 전에 존재했던 옵션이 섞여있는 것 같습니다.

<select>Firebug를 사용하여 검사 select="selected"하면 올바른 <option>태그에 있습니다. 페이지를 새로 고침 (또는이 페이지의 URL을 다시 입력하여 다시 입력)하면 제대로 표시되지 않지만 강제 새로 고침 (Ctrl + F5)은 합니다.

Chrome과 IE7 모두 처음에 올바르게 표시됩니다.

내 이론은 이것이 Firefox의 잘못된 캐시 전략의 결과라는 것입니다. 그게 맞나요? 내 코드에서 "이 페이지가 새로 고침되면 하드 새로 고침으로 만드세요. 모든 것을 처음부터 새로 고침하세요."라고 말할 수있는 방법이 있습니까?

최신 정보

이 문제를 해결하기 위해 전략을 변경했습니다.

• 이전 에는 현재 값이 기본값으로 설정된 각 테이블 행 <select>에 <option>s 의 긴 목록을 넣었습니다.
• 이제 현재 값을 <span>. 사용자가 "변경"버튼을 클릭하면, 나는 대체 <span>로모그래퍼 <select>하고 "변경"버튼을 "확인"버튼이됩니다. 옵션을 변경하고 확인을 클릭하면 AJAX가 데이터베이스를 업데이트하고 <select>및는 다시 <span>새 값으로 으로 돌아갑니다 .

여기에는 두 가지 이점이 있습니다.

• 위에서 설명한 버그 수정
• 페이지에 훨씬 적은 DOM 요소 가 필요합니다 (모든 중복 요소 <option>).

---

Firefox는 새로 고칠 때 선택한 양식 요소를 유지합니다. 의도적입니다. Ctrl + F5는이 동작을 비활성화하는 "하드"새로 고침입니다.

-

또는 Mac을 사용하는 경우 Command + Shift + R

---

비슷한 문제가 있었지만 autocomplete="off"모든 선택 태그에 HTML 속성을 추가 한 후에 작동했습니다. [Firefox 8을 사용하고있었습니다]

---

Firefox가 마지막으로 선택한 옵션을 캐싱하지 못하게하는 쉬운 방법은 페이지 언로드에서 모든 옵션 요소를 제거하는 것입니다. 예를 들어 (jQuery 가정) :

$(window).unload(function() {
  $('select option').remove();
});

---

나는 이와 같은 문제가 있었다. 어떤 옵션이 선택되었는지에 따라 선택 값을 변경하려고했지만 Firefox가 작동하지 않았습니다. 항상 첫 번째 옵션이 기본값입니다.

이 작업을 수행했을 때 Chrome, Safari 등이 작동했습니다.

$( 'option[value="myVal"]' ).attr( 'selected', 'selected' );

...하지만 이것은 FF에서 작동하지 않았습니다.

그래서 나는 시도했다.

$( 'option[value="myVal"]' ).prop( 'selected', 'selected' );

그리고 그것은 작동합니다.

jQuery v1.9.1

---

숨겨진 입력에 autocomplete = "off"를 입력하여 작동하게합니다.

---

이것은 오래된 질문이지만 아래 해결책은 누군가를 도울 수 있습니다

파이어 폭스에서, 나는 "선택"속성 일 당신이이 배치하지 않는 것을 통보했습니다 선택 돌며 양식 1, 양식에 이름 속성이를 .

<form name="test_form" method="POST">
<select name="city">
<option value="1">Test</option>
<option selected="selected" value="2">Test2</option>
</selecct>

다시 기억하십시오 :

1. 양식에는 " name "속성 이 있어야 하며
2. " select "는 양식 내에 있어야합니다.

---

Firebug에는 정확히이 시나리오에 대한 캐시 비활성화 기능이 있습니다.

더 깊은 장기적인 해결책은 서버 측에 캐시가없는 헤더를 설정하는 방법을 알아내는 것입니다. 어떤 웹 서버를 사용하고 있습니까?

---

Firefox에서 이상한 선택 옵션 버그가있을 때마다 여러 옵션이 선택된 것으로 표시 되었기 때문입니다. 하나만 그렇게 표시된 것이 확실합니까? AJAX로 변경하면 매우 쉽게 벗어날 수 있습니다.

---

FYI: in order to stop Firefox from restoring the previously selected option after page reload you can place the entire <form> containing the <select> options inside an <iframe>.

When select boxes are in <iframe> and you reload the container page, Firefox finally behaves like ALL other browsers, by simply resetting select options.

---

Thanks to @BananaDeveloper (https://stackoverflow.com/a/8258154/2182349) - this is my solution to solve this problem on a single page in an application

I didn't want to customize the off-the-shelf/open source application code

<Files "page_that_does_not_work.php">
        SetOutputFilter INFLATE;SUBSTITUTE;DEFLATE
        Substitute 's/<select/<select autocomplete="off"/n'
        Substitute 's/<form/<form novalidate/n'
</Files>

Apache docs for mod_substitute https://httpd.apache.org/docs/2.4/mod/mod_substitute.html

Thanks to: https://serverfault.com/questions/843905/apache-mod-substitute-works-in-curl-but-not-on-browser for the SetOutputFilter

---

I've figured out. If you put onunload or $(window).unload (jquery) on your HTML with no-cache header, Firefox reloads the page and initialize DOM even from back button.

참고URL : https://stackoverflow.com/questions/1479233/why-doesnt-firefox-show-the-correct-default-select-option