• HOME
  • JavaScript
  • ブラウザの戻るでJavaScriptの効果が残っている時の対処法

ブラウザの戻るでJavaScriptの効果が残っている時の対処法

管理人:sofu

JavaScriptで効果を与えたとき、別ページに飛んだあとブラウザの戻るボタンで、その効果が残っている時の対処法です。

例えば、画像にマウスオーバー処理を与えます。その画像をクリックし、別ページに飛んだあとブラウザの戻るボタンで戻るとマウスオーバー時の画像がそのまま残ってしまいます(Firefox、Safariのみ。IEは大丈夫。)これをどうやって解決するかというと

window.onunloadを使ってキャッシュを無効に

上記の様な現象が起こるのはブラウザのキャッシュのせいで、これを無効にすればいいのです。
FirefoxやSafariはonunloadイベントがあるとキャッシュしないみたいなので

window.onunload=function(){}

と書けばOK。

試してみたい方はこのコードを使ってみてください。

<body onload="alert('test');">

と書くと、戻るボタンでアラートが出ません。

<body onload="alert('test');" onunload="">

と書くと、戻ってもアラートが出ます。

注意

この方法は、キャッシュ機能を完全に無効にしてしまうため、動的に生成するページ等で利用するとパフォーマンス上の大きな障害になるので注意が必要です。

blog comments powered by Disqus

PageTop