NDW

アプリ開発やトラブルシューティング等のノウハウ、キャンプや登山の紹介や体験談など。

1. システムエンジニアリング html/jquery 実装技術

離脱確認ダイアログの仕様と表示方法

投稿日:

概要

  • ページ移動やページを閉じる際に、次のような確認ダイアログ(アンロードダイアログ)を表示できます。
    ここでは、このダイアログの仕様や表示方法を説明します。
  • なお、このダイアログの正式名称がはっきりしないので、ここでは「アンロードダイアログ」と表記しています。(Chromeのリリースノートでは”onbeforeunload dialogs”と表記していますが、少々長いのでこの名前にしています。)

基本的な仕様と表示方法

  • 基本的な表示方法
    beforeunloadイベントで任意の文字列を返却することで、ページ移動やページを閉じる際にアンロードダイアログを表示できます。アンロードダイアログを表示しない場合は文字列を返却しないようにします。
    window.onbeforeunload = function(e){
        return ''; // アンロードダイアログを表示(メッセージ指定不可)
        // return; // アンロードダイアログを非表示
    };
    
    $(window).on('beforeunload', function() {
        return ''; // アンロードダイアログを表示(メッセージ指定不可)
        // return; // アンロードダイアログを非表示
    };
    
  • アンロードダイアログに表示するメッセージは変更不可
    以前は、文字列を返却することで表示するメッセージを変更できましたが、最近のブラウザではセキュリティ上の理由でメッセージを変更できなくなりました。
    window.onbeforeunload = function(e){
        // return 'メッセージ1';          // 結果: 既定メッセージのダイアログが表示
        // e.returnValue = 'メッセージ3'; // 結果: 既定メッセージのダイアログが表示
        // alert("メッセージ3");          // 結果: エラー
    };
    
  • なお、独自メッセージを表示するためにalert()関数を使用すると、Chromeの場合は次のエラーになります。
    Blocked alert(‘…’) during beforeunload.







-1. システムエンジニアリング, html/jquery, 実装技術

関連記事

Logicool MX Keys(KX800)でキー入力が遅延する

事象 次のようにデスクトップPC(Windows10)にUSBレシーバ+MX Keys(KX800)環境で、キー入力が遅延する事象が時々発生します。 ミリ秒レベルの若干の入力遅延がある。入力できないわ …

Excel VBAでJSONを自動生成

サンプルExcelシートの説明 Excelシート上に記載したフィールドや値をJSONに出力できます。 「配列」(I列)、「型」(J列)を変更することで、JSONへの値の出力仕様を変更できます。JSON …

CentOS7のマルチホーム化

サイトの存在を隠しつつも、sftpサーバを公開し、後輩と1G以上のファイルのやりとりしたい。 パブリック側のIPアドレスを教えてしまうと、どこのサーバだろうかとブラウザで開いたりするとサイトの存在がわ …

パック10進数の変換方法とC#のサンプル

なお、ゾーン10進数はこちらで紹介しています。 パック10進数 ゾーン10進数の変換方法 10進数の各桁を「上位4ビットで1桁、下位4ビットで1桁」のバイトに変換して生成します。 生成したバイト列の最 …

Excelで大量データから重複値を検索する方法

100万件程の大量データの中で重複するデータを見つける方法を紹介します。 前提条件 検証で使用した環境は次の通りです。 RAND()関数で作成した約100万件(Excelの最大行数となる1,048,5 …