今いるページで何か操作をしてから画面遷移する前に以下のようなダイアログを出したい
デモ
上のテキストエリアに何か文字を入力してから
このページを閉じたり更新したり別のページへ移動したり
しようとすると確認ダイアログが表示されます
コード.gs
function doGet() {
return HtmlService.createHtmlOutputFromFile("index");
}
|
意訳この機能がやること 指定したHTMLファイルを表示する |
index.html
<!DOCTYPE html>
<html>
<body>
<textarea></textarea>
<script>
window.onbeforeunload = function(e) {
return e.returnValue;
}
</script>
</body>
</html>
|
意訳テキストエリア 画面遷移前に 確認ダイアログを返す |
補足
参考にしたサイトではダイアログにメッセージを表示できそうにかかれていましたが
手元で試したところメッセージは渡せずに
行った変更が保存されない可能性があります。
という固定の文字列しか表示できなかった。
こういうhtmlを試してみた
index.html<!DOCTYPE html>
<html>
<body>
<textarea></textarea>
<script>
window.onbeforeunload = function(e) {
var dialogText = '本当にこのページを離れていいですか？';
e.returnValue = dialogText;
return dialogText;
};
</script>
</body>
</html>
|
本当にこのページを離れていいですか？
はダイアログに表示されず
行った変更が保存されない可能性があります。
が表示された。
参考
window.onbeforeunload
https://developer.mozilla.org/ja/docs/Web/API/WindowEventHandlers/onbeforeunload
window.onbeforeunload
https://developer.mozilla.org/ja/docs/Web/API/WindowEventHandlers/onbeforeunload
