12

我目前正在检测我的网站的用户是否关闭了窗口/选项卡或更改了 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 中没有任何内容可以让用户留在页面上。(用户不必单击警报中的按钮)

关于我如何解决这个问题的任何建议?

干杯,丹

4

1 回答 1

8

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

您可以将 beforeunload 事件与 Jquery 一起使用,以在屏幕上显示覆盖。

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

于 2013-05-14T10:44:09.060 回答