ネットサービスの開発に役立ちそうな話題を中心にお届けします。
F.Ko-Jiの「一秒後は未来」 > Javascript > ページを移動する前にJavaScriptで確認ダイアログを表示する
2010年08月05日 13:12
553日前に投稿

ページを移動する前にJavaScriptで確認ダイアログを表示する

  • ... PV
  • このエントリーをはてなブックマークに追加

スポンサード リンク

よく編集した内容を保存せずにブラウザを閉じたり、別のページに移動しようとしたりする際に確認ダイアログが表示されることがあります。

onbeforeunload-dialog.gif

↑ こんなダイアログ。

これを実装するには、JavaScriptで次のようにします。

function hoge(event) {
    if (確認ダイアログを表示するかどうか) {
        event = event || window.event;
        return event.returnValue = '表示させたいメッセージ';
    }
}
if (window.addEventListener) {
    window.addEventListener('beforeunload', hoge, false);
}
if (window.attachEvent) {
    window.attachEvent('onbeforeunload', hoge);
}

event.returnValue を return する関数を beforeunload / onbeforeunload イベント発生時の処理として定義するといいようです。毎回ダイアログが表示されると困るので、if文で表示条件を定義することになると思います。

【参考】
» 自分自身をロードするときにフレーム解除してロードしようとするサイトをフレームで開くときの抑制方法 - blog.katsuma.tv
» ページ移動の前に確認をする、onbeforeunloadサンプル:phpspot開発日誌

スポンサード リンク

Written by
Meity.jp - 「DM送りたいのでフォローしてください」とかめんどくさくないですか?


トラックバック

このエントリーのトラックバックURL:

Javascript

English version

前のエントリー: « 4匹の子猫がエサを求めてミャーミャーしてる動画
次のエントリー: iPhoneアプリには推奨スペック表示が必要だと思う »

コピペにご利用ください。

タイトル:

URL:

リンク用HTMLタグ: