作成日:2017-12-08, 更新日:2017-12-08
困った内容
・「ページA」から「ページB」に遷移の際にローディング画像を表示。
・「ページB」からブラウザの「戻る」で「ページA」を表示したらローディング画像を表示されたまま。
希望は
・ブラウザの「戻る」で「ページA」を表示したらローディング画像は消えていてほしい。
普段はChromeだったんで気にしていなかったんだけど、Firefoxで上記のように表示されたままになっているとのこと。
結論と経緯
結論
(上記の「ページA」に)「window.onunload = function(){};」を追記する
「JqueryとCSSでローディング画像」の「HTML側」ってトコのソースが対象箇所。
経緯
色々と調べたり、試したりした。
▼「window.onpopstate」を使えと言われた
window.onpopstate = function(event) { ~ 処理 ~ };
・「ページA」に記載して、リロード。
・「ページB」に遷移→無反応
・ブラウザの「戻る」で「ページA」に戻ってくる→無反応
・「ページA」でブラウザの「進む」や「戻る」で違うページに遷移→無反応
▼「$(window).on('popstate', ~」を使えと言われた
$(window).on('popstate', function(e){ ~ 処理 ~ });
・「ページA」に記載して、リロード。
・「ページB」に遷移→無反応
・ブラウザの「戻る」で「ページA」に戻ってくる→無反応
・「ページA」でブラウザの「進む」や「戻る」で違うページに遷移→無反応
紆余曲折があり・・・ブラウザの「戻る」を押したときにリファラを条件にして「戻る」を無効、「リダイレクト」にすれば?と思いつつもコレもダメ。
その後、しばらく調べてこの日は、挫折。翌日、再調査して結論に至る。
メモ
window.onunloadってヤツを入れる理由は・・・下記が参考になりそう。「アンロードイベント」ってのは「読み込みをしないイベント」って意味? よく分からない・・・。
Summary
The unload event is raised when the window is unloading its content and resources. The resources removal is processed after the unload event occurs.
~略~
Notes
Using this event handler in your page prevents Firefox 1.5 from caching the page in the in-memory bfcache. See Using Firefox 1.5 caching for details.
- Summaryの内容
-
アンロードイベントは、ウィンドウがコンテンツとリソースをアンロードするときに発生します。 アンロードイベントが発生した後、リソースの削除が処理されます。
- Notesの内容
-
このイベントハンドラをページ内で使用すると、Firefox 1.5はページをメモリ内のbfcacheにキャッシュできなくなります。 詳細については、Firefox 1.5のキャッシュの使用を参照してください。