ページ遷移前に確認ダイアログを出す onbeforeunload

編集中に別のページに遷移しようとした時に確認ダイアログを出したい。
以下のように onbeforeunload イベントを使えばOK。

window.onbeforeunload = function (e) {
  var e = e || window.event;

  // For IE and Firefox prior to version 4
  if (e) {
    e.returnValue = 'Any string';
  }

  // For Safari
  return 'Any string';
};

jQueryの場合

$(window).bind('beforeunload', function(event) {
	return 'Any string';
});

ただし、IEの場合は以下のような遷移しないaタグでもonbeforeunloadが発生してしまう。

<a href="javascript:void(0);">保存</a>

以下のように対応

var execBeforeUnload = true;
$(window).bind('beforeunload', function(e) {
	if (execBeforeUnload) {
		return 'Any string';
	}
});

$(document).ready(function() {
	$('a').click(function(e) {
		if (e.target.href && e.target.href.indexOf("javascript") === 0) {
			cancelBeforeUnload();
		}
	});
});

function cancelBeforeUnload() {
	execBeforeUnload = false;
	setTimeout(function() {
		execBeforeUnload = true;
	}, 0);
}

参考：
window.onbeforeunload - MDC Doc Center
https://developer.mozilla.org/en/DOM/window.onbeforeunload

ページ移動前に確認ダイアログ - ironsJPのブログ - Yahoo!ブログ
http://blogs.yahoo.co.jp/irons765/6688178.html