Определить браузер или закрытие вкладки - PullRequest
Новая
       20

Определить браузер или закрытие вкладки

257 голосов
/ 08 октября 2010

Существует ли какой-либо кросс-браузерный код JavaScript / jQuery, чтобы определить, закрыта ли вкладка браузера или браузера, но не из-за нажатия на ссылку?

Ответы [ 20 ]

238 голосов
/ 08 октября 2010

Если я вас правильно понял, вы хотите знать, когда вкладка / окно эффективно закрывается. Ну, AFAIK единственный способ в Javascript обнаружить такие вещи - это onunload & onbeforeunload события.

К сожалению (или к счастью?), Эти события также запускаются, когда вы покидаете сайт через link или кнопку возврата в браузере. Так что это лучший ответ, который я могу дать, я не думаю, что вы можете изначально определить чистый close в Javascript. Поправь меня, если я здесь не прав.

108 голосов
/ 23 октября 2013

С Документация Firefox

По некоторым причинам браузеры на основе Webkit не следуют спецификации для диалогового окна.Практически перекрестный пример будет близок к приведенному ниже. 

window.addEventListener("beforeunload", function (e) {
  var confirmationMessage = "\o/";

  (e || window.event).returnValue = confirmationMessage; //Gecko + IE
  return confirmationMessage;                            //Webkit, Safari, Chrome
});

Этот пример для обработки всех браузеров.

40 голосов
/ 21 мая 2014

Простое решение 

window.onbeforeunload = function () {
    return "Do you really want to close?";
};
18 голосов
/ 08 апреля 2011 
<body onbeforeunload="ConfirmClose()" onunload="HandleOnClose()">

var myclose = false;

function ConfirmClose()
{
    if (event.clientY < 0)
    {
        event.returnValue = 'You have closed the browser. Do you want to logout from your application?';
        setTimeout('myclose=false',10);
        myclose=true;
    }
}

function HandleOnClose()
{
    if (myclose==true) 
    {
        //the url of your logout page which invalidate session on logout 
        location.replace('/contextpath/j_spring_security_logout') ;
    }   
}

// Это работает в IE7, если вы закрываете вкладку или браузер только с одной вкладкой

6 голосов
/ 18 мая 2017

Мне нужно было автоматически выходить из системы при закрытии браузера или вкладки, но не при переходе пользователя по другим ссылкам.Я также не хотел, чтобы в этом случае отображался запрос на подтверждение.Поработав с этим некоторое время, особенно с IE и Edge, вот что я закончил (проверил работу с IE 11, Edge, Chrome и Firefox) после того, как основал подход с помощью этого ответа .

Сначала запустите таймер обратного отсчета на сервере в обработчике событий beforeunload в JS.Для правильной работы IE и Edge вызовы ajax должны быть синхронными.Вам также необходимо использовать return;, чтобы диалоговое окно подтверждения не отображалось следующим образом: 

    window.addEventListener("beforeunload", function (e) {        
      $.ajax({
          type: "POST",
          url: startTimerUrl,
          async: false           
      });
      return;
    });

При запуске таймера для флага cancelLogout устанавливается значение false .Если пользователь обновляет страницу или переходит на другую внутреннюю ссылку, флаг cancelLogout на сервере устанавливается на true .По истечении времени таймера он проверяет флаг cancelLogout, чтобы узнать, отменено ли событие выхода из системы.Если таймер был отменен, то он остановит таймер.Если браузер или вкладка были закрыты, тогда флаг cancelLogout останется false , и обработчик событий выведет пользователя из системы.

Примечание по реализации: я использую ASP.NET MVC5, и я отменяю выход из системы переопределенным методом Controller.OnActionExecuted().

6 голосов
/ 19 июля 2014

Извините, я не смог добавить комментарий к одному из существующих ответов, но в случае, если вы хотите реализовать своего рода диалоговое окно с предупреждением, я просто хотел упомянуть, что любая функция обработчика события имеет аргумент - событие.В вашем случае вы можете вызвать event.preventDefault (), чтобы запретить покидать страницу автоматически, а затем запустить собственный диалог.Я считаю, что это лучший вариант, чем использование стандартных уродливых и небезопасных оповещений ().Я лично реализовал свой собственный набор диалоговых окон на основе объекта kendoWindow (пользовательский интерфейс Telerik Kendo, который почти полностью открыт, кроме kendoGrid и kendoEditor).Вы также можете использовать диалоговые окна из jQuery UI.Обратите внимание, что такие вещи асинхронны, и вам нужно будет привязать обработчик к событию onclick для каждой кнопки, но это все довольно легко реализовать.

Однако я согласен с тем, что отсутствие события реального закрытия ужасно: например, если вы хотите сбросить состояние сеанса на бэкэнде только в случае реального закрытия, это проблема.

4 голосов
/ 05 апреля 2016

Нет события, но есть свойство window.closed, которое поддерживается во всех основных браузерах на момент написания этой статьи. Таким образом, если вам действительно нужно знать, вы можете опрашивать окно, чтобы проверить это свойство.

if(myWindow.closed){do things}

Примечание: Как правило, опрос не является лучшим решением. Событие window.onbeforeunload следует использовать, если это возможно, единственное предостережение в том, что оно также срабатывает, если вы уходите.

4 голосов
/ 07 мая 2018

Для подобных задач вы можете использовать sessionStorage для локального хранения данных, пока вкладка браузера не будет закрыта.

Объект sessionStorage хранит данные только для одного сеанса (данные удаляются, когда вкладка браузеразакрыто). ( W3Schools )

Это моя ручка . 

<div id="Notice">
    <span title="remove this until browser tab is closed"><u>dismiss</u>.</span>
</div>
<script>
    $("#Notice").click(function() {
     //set sessionStorage on click
        sessionStorage.setItem("dismissNotice", "Hello");
        $("#Notice").remove();
    });
    if (sessionStorage.getItem("dismissNotice"))
    //When sessionStorage is set Do stuff...
        $("#Notice").remove();
</script>
4 голосов
/ 26 ноября 2012 
$(window).unload( function () { alert("Bye now!"); } );
1 голос
/ 28 мая 2013 
window.onbeforeunload = function() {
  console.log('event');
  return false; //here also can be string, that will be shown to the user
}
Страница:
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...