onbeforeunload 导航使用 location.href答案

【问题标题】：onbeforeunload navigation using location.hrefonbeforeunload 导航使用 location.href
【发布时间】：2016-04-18 06:50:29
【问题描述】：

我的应用程序是 MVC5，我想在用户关闭浏览器选项卡时提醒他们。我找到了这个解决方案Setting onbeforeunload on body element in Chrome and IE using jQuery，效果很好，除了我在少数情况下使用 location.href（Telerik 网格内的自定义命令按钮）。尝试了以下方法：

 $(window).bind('hashchange', function() {
              validNavigation = true;
    });

避免询问用户是否要离开页面。有没有更好的方法在关闭浏览器选项卡之前提醒用户？

【问题讨论】：

那为什么还要hashchange呢？我的问题似乎很矛盾。
也许 haschange 不是检测页面位置变化的正确方法；当我使用 location.href 时，无法以正确的方式覆盖 onbeforeunload。使用的解决方案： $("a").bind("click", function() { validNavigation = true; });

标签： javascript jquery html

【解决方案1】：

试试这个;)

需要对这段代码进行一些修改：

window.onbeforeunload = function() {
  if(validNavigation){
    validNavigation = false;
    /* if this click is valid means user action is not close window or reload page then just return; */
    return;
  }

  /* Want to ask user before leaving the page */
  return "Are you sure you want to leave this page bla bla bla?"; // you can make this dynamic, ofcourse...
};


validNavigation = true;
$(document).on('click', '.validNavigation', function(){
  validNavigation = true;
});

现在您需要做的是将validNavigation 类添加到您不想向用户显示onbeforeunload 消息的所有链接；

更新根据评论：

function gotopage(args){
  /* set validNavigation to true to don't show warning on page load; */
  validNavigation = true;
  window.location.href = [args];
}

对于您不想向用户显示警告的操作，只需设置validNavigation = true; 并在其后放置语句可能会导致位置更改；

【讨论】：

谢谢，听起来不错；但是我找不到如何向其中添加类： function gotopage(args) { window.location.href = [args]; }
当您不想向用户显示此警告时，可以将类添加到 a 或设置 validNavigation = true; 以执行某些操作；
效果很好。使用 lightgallery 灯箱时的期望。我必须添加 $('#lightgallery').bind("click", function () { validNavigation = false; });。谢谢
@hncl 你需要加validNavigation = true;而不是validNavigation = false;;