どもです。
今回はjQuery弄ってて躓いたのでめもめも。
フォームメールcgiに連動したjsを作ったは良いのですが、cgiのフォームは大体が「確認画面」「完了画面」への遷移をします。
入力内容に不備があってエラーになったり、入力した内容を修正したいときはブラウザの「戻る」を使うか、onclick="javascript:history.back()"などブラウザバック機能を搭載したボタンを設置するのが定石です（でないと入力した内容がチャラになりますし）。
で、今回、ブラウザバックしたらフォームに連動したjsが上手く動いてくれませんでした。
具体的には、デフォルトで内容Aを表示・ラジオボタンBをチェックすることで内容Bを表示、とするjsで、Bを選択して確認画面→ブラウザバックしたら、ラジオボタンはBのまま内容Aが表示されていたという感じ。
…文章にするとわかりにくいなぁ(´・ω・｀)
ともかく、どういうやり方ならブラウザバックしても動くのか、調査してみました。
NGなパターン
- トリガーを設置せずに直接書き始める
- $(window).bind("unload",function(){});
- $(window).unload(function(){});
何故でしょうか。
一番上はともかく、他はGoogle先生的には太鼓判のやり方のハズなのに動きませんでした。
OKなパターン
- $(document).ready(function(){});
- $(window).load(function(){});
むしろこっちのが普通というか、ベタなやり方だと思うのですが、こっちだと動くみたいです。
IE、Chrome、FFで動作確認。
どっちの方が良いの？
両者でブラウザテストしたところ微妙に差異が発生したのでついでにめもめも。
IE、FFではどちらも同じような感じだったのですが、Chromeに限って、
$(window).load(function(){});だと一瞬のズレが発生したのに対し、
$(document).ready(function(){});だと一瞬のズレも発生しませんでした。
$(document).ready(function(){});はほぼページ開始時に、$(window).load(function(){});は読み込み完了時に始まるトリガーです。
画像の量など、ページの重さによって使い分けることをオススメします。
あ。.loadが廃止になってる。（2017/10 追記）
$(window).load(function(){})がjQuery3.0から使えなくなってますね。（.loadが廃止）
代わりに$(window).on("load",function(){});使うようにした方が良さげです。