ブラウザのウインドウを閉じる前に警告する

社内システム向けで、ブラウザウインドウを閉じる[×]ボタンなどで閉じてしまわないよう警告を出したいという要望があったので、対応した際のメモ。

  • タイトルバーの閉じるボタンやキーボードショートカット(CTRL+Wなど)で閉じようとしたときに警告する
  • 画面上のボタンやリンクをクリックしたときは警告しない

ユーザが表示中の画面から遷移または閉じようとした際に警告メッセージを出すためのイベントとして、window.onbeforeunload がある。

window.onbeforeunload = function(e){
return "ウインドウを閉じようとしています";
};

ただ、このままでは画面上のボタンやリンクをクリックした際にも警告が出てしまう。

そこで、ボタンやリンクをクリックした際にはメッセージを出さないようにイベントハンドラを置き換えておき、その後で再び警告が出るようにハンドラをセットしなおすという方法を考えた。
jQueryを使用しています)

function onBeforeUnload(e) {
return 'ウインドウを閉じようとしています';
}

$(function(){
setTimeout( function() {
window.onbeforeunload = onBeforeUnload;
}, 100);

$('a,:input').bind('click', function(){
window.onbeforeunload = function(e) {};
setTimeout( function() {
window.onbeforeunload = onBeforeUnload;
}, 100);
});
});

こんな感じ?