Запросить подтверждение при закрытии вкладки

Когда я закрываю свою страницу в каком-то браузере, я хочу, чтобы появилось окно сообщения, и спросить меня, действительно ли я хочу закрыть страницу или нет, двумя кнопками, и если я нажму No, то эта вкладка не будет замкнутый.

Как я могу это сделать?

Ответ 1

Вам нужно прослушать нестандартное событие beforeunload. Это поддерживается почти всеми браузерами, ожидающими от Opera, которая, как известно, строго придерживается стандартов W3C.

Вот пример запуска:

window.onbeforeunload = function() {
    return "Hey, you're leaving the site. Bye!";
};

Это сообщение появится в виде диалога подтверждения. Это сообщение появится прямо перед тем, как клиент выгрузит страницу. Это может быть закрытие браузера, но это также может быть простым навигационным действием, например, щелчком по ссылке или отправкой формы на странице!

Скорее всего, вы также захотите отключить его (просто установите null) при каждом щелчке по внутренней ссылке или отправке внутренней формы. Вы не хотите раздражать конечных людей неинтуитивным поведением. Вы можете сделать это, прослушивая событие click для желаемых ссылок и событие submit желаемых форм. jQuery может быть здесь очень полезной, поскольку он делает это с помощью crossbrowser-совместимого способа, так что вам не нужно писать > 20 строк кода JS для этого:

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
    window.onbeforeunload = function() {
        return "You're leaving the site.";
    };
    $(document).ready(function() {
        $('a[rel!=ext]').click(function() { window.onbeforeunload = null; });
        $('form').submit(function() { window.onbeforeunload = null; });
    });
</script>

Вам нужно всего лишь предоставить всем внешним ссылкам атрибут deacto standard rel="ext", чтобы обозначить, что это внешние ссылки.

<a href="http://google.com" rel="ext">Google</a>

Ответ 2

onbeforeunload срабатывает перед onunload.

Вы не можете отменить событие в onunload. onbeforeunload позволяет возвращать строку из событий (например, window.onbeforeunload = function() {return "really leave now?"}), и браузер задает пользователю вопрос о том, хотят ли они покинуть вашу страницу. На странице не говорится о прекращении события, если нажата кнопка "Да" (что Кстати, это должно быть слишком по-моему.)

Общие пункты:

  • alert, prompt и confirm не допускаются ни в одном из событий.
  • В Opera не поддерживается.

ПРЕДУПРЕЖДЕНИЕ: В IE6/7 по крайней мере (и, возможно, IE8, но не FF/Chrome и т.д.) onbeforeunload и onunload запускаются при нажатии ссылок anchors/javascript. Некоторые примеры:

  • <a href="#myanchor">trigger unload!</a>
  • <a href="javascript: alert('message!')">trigger unload!</a>

(MSDN так же хорош, как и любой другой, считая его нестандартным и что Firefox/Chrome/Safari, похоже, в значительной степени скопировал реализацию из IE.)

Ответ 3

использовать событие onbeforeunload

window.onbeforeunload = function(){
    return "Are you sure you want to close the window?";
}

Это отобразит окно сообщений, в котором пользователь может выбрать, закрыть или закрыть окно.

Обратите внимание, что это не поддерживается Opera.