Blog

【jQuery】ページ離脱時に確認メッセージを表示させる方法

2013.03.19Cat:jQuery プログラマー

wordpressなど、投稿ページから別のページに遷移しようとしたら、「このページから移動してもよろしいですか」という確認ウィンドウが出てくるから、
かっこ良くていつか実装してみたいと思いました。

調べてみたら、jQueryのbeforeunloadイベントを使って簡単に実現できるようです。

サンプルを見てください。

仕様

inputのテキストボクスに変更があった場合のみ、
「戻る」(実際はプログラミングのカテゴリに遷移する)ボタンを押したら、確認ウィンドウが出てきます。

IE8でもテストOKです。

でもページを閉じようとしても、確認ウィンドウも出てきて、ちょっとうるさいですね。

ソース

ソースコードを簡単に貼ります。

Author Profile

jeff_maj

システムエンジニア/1984年生/上海交通大学卒/Webサービス/EC/iphone/android

» 投稿一覧
  • Launch Cart次世代ECサイト構築システム 初期月額無料
  • LaunchMovie ECに特化した動画制作サービス

Archive

ページTOPへ