ページ遷移時に確認ダイアログを表示する
概要
ユーザーからの入力が必要なページを作成する場合、ブラウザの更新ボタンやページ上のリンクを間違って押してしまうと、入力中のデータが失われ、再度、同じ情報を入力しなければいけなくなる場合があります。ボタンやリンク以外にもキーボードのタイプミスでページが切り替わってしまうことがあるので、入力途中のページであればページ遷移時に確認ダイアログを表示するのが一般的だと思います。
以下はその方法です。
詳細
ページ遷移が行われる前に確認ダイアログを表示するには、「beforeunload」イベントで「event.returnValue」にメッセージを設定します。
window.addEventListener('beforeunload', function(){
event.returnValue='入力中の内容は破棄されます。';
});
×ボタンや他ページへのリンクが押下された場合（Chrome）
更新ボタンが押下された場合（Chrome）
入力中の状態の時のみ確認ダイアログを表示したい場合は、フラグを用意して「event.returnValue」にメッセージを設定しないようにすると、ダイアログは表示されなくなります。
なお、自前で作成したダイアログを表示したいといったことは仕様上、無理っぽいです。