Firefoxで戻るボタンを押したときに前の効果が残ったままになる

タイトルのことで少しハマったのでメモメモ。

検索ボタンなどを二重押しさせないようにJavaScriptの方で、一度押したらそのボタンを押せないようにしてた（もちろん検索後はPOSTするので元に戻る）
IEでは問題なくこれで動くけど、Firefoxでは戻るボタンを押したときにボタンが押せないままになっている。

この原因はIEとかChromeはonloadイベントが呼ばれるけど、Firefoxでは呼ばれないために起こるっぽい。
なのでFirefox用に戻るボタン押下時やページ表示時に実行されるというpageshowを使って対応することにした。

javascript

/*
 * 検索ボタン
 */
$( document ).on( "click", "#Search", function()
{
  /* 検索の処理とか */

  /* ------------ */

  document.body.style.cursor = 'wait';  // カーソルを待機中に変える
  $('input').css('cursor', 'wait');     // ボタン上のカーソルを変える
  return true;
} );


/*
 * 二度押し防止
 */
var doubleSubmitSet = 0;
function double()
{
  if ( doubleSubmitSet == 0 )
  {
    doubleSubmitSet = 1;
  }
  else
  {
    alert( "二重押し禁止！！" );
    return false;
  }
}

/*
 * 二度押し防止の処理をした後に戻るボタンで戻った時の動作
 */
window.onpageshow = function()
{
  doubleSubmitSet = 0;
  document.body.style.cursor = 'auto';  // カーソルを待機中に元に戻す
  $('input').css('cursor', 'auto');     // ボタン上のカーソルを元に戻す
}

HTML

<form action="xxx" method="post" id="SearchForm" onSubmit="return double()">
  <input type="submit" value="検索" id="Search" name="Search">
<form>

これで必ずページ表示時に二重押しのフラグがリセットされるため、戻るボタンを押してもクリックできる。
これ以外にも「window.onunload=function(){}」を使いキャッシュ機能を無効にすることでも出来るけど、キャッシュ無効はパフォーマンス的に厳しいので今回はこちらにした。

この方法だとSafariがまだ対応できていないので、別途追加しなくては・・。

参考：ブラウザの戻るボタンで戻ったときに呼ばれるイベントとかキャッシュとかそこらへんのことAdd Star
http://d.hatena.ne.jp/koumiya/20080916/1221580149

window.onunloadを使ってキャッシュを無効に
http://www.webbibo.com/blog/javascript/onunload.html