お寿司か焼き肉食べたい

まじめな事からしょーもない事まで
めにゅーを開く(投げやり)

もう帰るの?もうちょっといてよ!

フォーム等ではよく動作しているものですね。
ページ遷移を行われようとするときに出るアラート。

unload

ググるとすぐに出てくるのは、unloadイベント系列
2015/07/15 FireFox Chrome動作しない。
なんでや!

beforeunload

巡り巡って出会ったのがこのイベント。beforeunload
その名の通り、unloadよか早く動作するイベントとなります。
わーい。べんりー

$(window).on('beforeunload', function() {
 return '好きなメッセージを返す事ができるすぐれもの';
});

だかしかし。

上記処理は残念ながら何してもアラートが出ます。
つまり、フォーム入力して確認画面等へのsubmitを行っても出るわけです。
煩わしすぎ

おい、やめろ馬鹿このEVENTは早くも終了ですね

回避策はちゃんとあります。
要するに、出したくない所でイベントを取っちゃえばいいだけの話です。

$(function(){
 // submitボタン的な
 $('.btnSubmit').on('click',function()
 {
  $(window).off('beforeunload');
  document.forms[0].submit();
 });

 // aリンクでアラートを出したくないもの
 // 指定要素に関しては都度書き換えてください。

 $('.noAlert').on('click',function()
 {
  $(window).off('beforeunload');
 });

 $(window).on('beforeunload', function() {
  return '購入は完了していません。\n\nこのページから移動しますか?入力したデータは保存されません。';
 });
});

これで必要な所だけアラートが出るようになりました。うぃ
※注意※
指定メッセージが表示されないブラウザがある模様。FireFoxとかFireFoxとかFireFoxとか。

2016/3/23 追記
FireFoxの仕様が変わって、ページオープン後、ユーザーが動作を行わない状態ではbeforeunloadが無視される仕様になりました。
クリックとかなんか入力とかですね。
ページ開いてそのままリロードなどを行うと効かないわけで。
ページのどこでもいいのでクリックとかしてくれればきちんと動作します。
いらんことしやがって

デモっさん。出番です。

アラートが出ます。
アラートはでません。