web-dev-qa-db-ja.com

Webページから移動する際のアラート

未保存の変更でGoogleドキュメントタブを閉じようとすると、これがブラウザに表示されます(FF 3.5)。

このページから移動してよろしいですか?

このドキュメントには未保存の変更があります。今すぐキャンセルをクリックし、「保存」をクリックして保存します。それらを破棄するには、[OK]をクリックします。

OKを押して続行するか、キャンセルを押して現在のページにとどまります。

私の質問は、そのようなアラートがWebアプリの一部(たとえばgdocsなど)なのか、それともブラウザによって提供されるのかということです。後者の場合、これはどのように行われますか?

53
Vijay Dev

ブラウザで。ダイアログのカスタマイズされたテキストを返すのはbeforeunloadイベントハンドラーです。これは3つの段落の中央にすぎません。他の2つの段落とボタンのテキストはカスタマイズも変更もできません。

window.onbeforeunload = function(){ return 'Testing...' }

// OR

var unloadListener = function(){ return 'Testing...' };
window.addEventListener('beforeunload', unloadListener);

というダイアログが表示されます

Are you sure you want to navigate away from this page?

Testing...

Press OK to continue, or Cancel to stay on the current page.

これを無効にするには、ハンドラーをnullに設定します

window.onbeforeunload = null;

// OR

window.removeEventListener('beforeunload', unloadListener);
85
Peter Bailey