窗口关闭事件上的javascript

Question

我目前正在检测我网站的用户是否关闭了窗口/标签或更改了 url。

我正在使用以下代码，它运行良好:

var validNavigation = false;

function endSession() {
  // Browser or broswer tab is closed
  // Do sth here ...
  alert("bye");

}

function wireUpEvents() {

  window.onbeforeunload = function() {
      if (!validNavigation) {
         endSession();
      }
  }

  // Attach the event keypress to exclude the F5 refresh
  $(document).bind('keypress', function(e) {
    if (e.keyCode == 116){
      validNavigation = true;
    }
  });

  // Attach the event click for all links in the page
  $("a").bind("click", function() {
    validNavigation = true;
  });

  // Attach the event submit for all forms in the page
  $("form").bind("submit", function() {
    validNavigation = true;
  });

  // Attach the event click for all inputs in the page
  $("input[type=submit]").bind("click", function() {
    validNavigation = true;
  });

}


$(document).ready(function() {
  wireUpEvents(); 
});

我的问题是我想将事件从警报更改为覆盖。我已经设置了一个隐藏的 div 覆盖并将上面代码中的警报替换为:

$('.overlay').css('display','block');

现在这不再有效，因为 div 中没有任何东西可以让用户留在页面上。 (用户不必单击警报中的按钮)

关于如何解决这个问题有什么建议吗？

干杯，丹

Answer 1

窗口关闭事件作为最后一个事件被触发。因此在它之后不会触发其他事件。

您可以将 beforeunload 事件与 Jquery 一起使用，以在屏幕上显示叠加层。

以下链接可能有所帮助:link