web-dev-qa-db-ja.com

ブラウザを閉じる前にユーザーにプロンプ​​トを表示しますか?

教師がログアウトしたりブラウザウィンドウを閉じたりする前に、最新のPDFの手順をダウンロードするのを常に忘れている管理ポータルがあります。見回しましたが、探しているものが見つかりません。にとって。

次の目標を達成したいと思います。

目標1

ユーザーがブラウザウィンドウを閉じる前に、「フォームをダウンロードしたことを覚えていますか?」というプロンプトが表示されます。はい/いいえの2つのオプションがあります。はいの場合は閉じ、いいえの場合はページに戻ります。

目標2

ユーザーが「ログアウト」ボタンをクリックする前に、上記と同じプロンプトが表示されます。

非常に基本的なコード(ブラウザーを閉じる場合は機能しません)での最初のパスは次のとおりです。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<script type="text/javascript">
function init() {
    if (window.addEventListener) {
        window.addEventListener("beforeunload", unloadMess, false);
    } else if (window.onbeforeunload) {
        window.onbeforeunload = unloadMess;
    };
}

function unloadMess() {
    var User_Message = "[Your user message here]"
    return User_Message;
}
</script>
</head>

<body onload="init();">
     hello this is my site
</body>
</html>

編集-新しい問題

以下に示すソリューションは機能しますが、独自の問題もあります。

ユーザーがリンクをクリックして実際にフォームをダウンロードすると、ページはユーザーが離れようとしていると見なし、エラーメッセージを表示します。また、あるイベントまたは別のイベントが発生することを望んでいますが、必ずしも両方ではありません。つまり「ログアウト」ボタンを押すと、OnClickイベントが表示され、次にブラウザのプロンプトが表示されます。何か案は?

18
JM4

2017年更新

最近のすべてのブラウザは、カスタムメッセージをサポートしなくなりました。

window.onbeforeunload = function(evt) {
   return true;
}

これはタブを閉じるためのものです:

window.onbeforeunload = function(evt) {
    var message = 'Did you remember to download your form?';
    if (typeof evt == 'undefined') {
        evt = window.event;
    }
    if (evt) {
        evt.returnValue = message;
    }

    return message;
}

ログアウトボタンにonClickイベントを使用します:

onClick="return confirm('Did you remember to download your form?');"
24
Mohit Jain

これはあなたの問題の一部かもしれないと思います:

else if(window.onbeforeunload) {
  window.onbeforeunload = unloadMess;
};

「if」ステートメントでのそのテストは、ハンドラー関数がすでに存在する場合にのみ真になります。このテストは、「ウィンドウオブジェクトに「onbeforeunload」プロパティがありますか?」という意味ではありません。これは、「ウィンドウの「onbeforeunload」プロパティは現在nullではないか」という意味です。

どのブラウザでも、「onbeforeunload」を直接設定するのが安全だと思います。

2
Pointy

onbeforeunloadでアラートなどを行うことはできません。また、onclickなどの他のイベントのように、単にfalseを返してユーザーがページを離れないようにすることはできません。これは、サイトがそれを離れることを不可能にすることを可能にするでしょう。

ただし、文字列を返すだけで、ブラウザに文字列を含む確認ダイアログが表示され、ユーザーに本当に終了するかどうかを尋ねます。

1
Marian

ポインティはブラウザのクローズイベントについて正しいです-邪悪なサイトがあなたが彼らのウィンドウを閉じるのを妨げることができるかどうか想像してみてください??したがって、防止サイトを閉じることはできませんが、アラートを送信することはできます。

ログアウトボタンに関する限り、それははるかに簡単です。

<a href="logout.html" onClick="return confirm('Did you remember to download your form?');">Logout</a>
0
Ryley