jquery beforeunload 关闭(不离开)页面时

发布于09月16日

如何显示"您确定要离开页面吗？"当用户实际试图关闭页面时(单击浏览器窗口或选项卡上的X按钮)，而不是当用户试图离开页面时(单击另一个链接).

My client wants a message to appear when the user tries to close the page "Are you sure you want to leave the page? You still have items in your shopping cart."

不幸的是，$(window).bind('beforeunload')并不是只有在用户关闭页面时才会触发的.

jQuery:

function checkCart() { 
  $.ajax({
    url : 'index.php?route=module/cart/check',
    type : 'POST',
    dataType : 'json',
    success : function (result) {
       if (result) {
        $(window).bind('beforeunload', function(){
          return 'leave?';
        });
       }
    }
  })
}

推荐答案

You can do this by using JQuery.

example美元，

<a href="your URL" id="navigate"> click here </a>

你的JQuery美元，

$(document).ready(function(){

    $('a').on('mousedown', stopNavigate);

    $('a').on('mouseleave', function () {
           $(window).on('beforeunload', function(){
                  return 'Are you sure you want to leave?';
           });
    });
});

function stopNavigate(){    
    $(window).off('beforeunload');
}

And to get the Leave message alert will be,

$(window).on('beforeunload', function(){
      return 'Are you sure you want to leave?';
});

$(window).on('unload', function(){

         logout();

});

这个解决方案可以在所有浏览器中使用，我已经对其进行了测试.