onbeforeunload上需要帮助或单击浏览器后退按钮

Question

如果用户单击浏览器的后退按钮，则我需要出现提示并要求确认。 如果用户点击“确定”，则应该导航到xx.html 。 如果用户点击“取消”，则应该阻止导航。 我怎样才能做到这一点？

注意：我已经尝试过onbeforeunload方法，但它适用于所有导航操作。 例如，单击页面上的链接也将触发此事件并向用户显示消息。

Answer 1

你不能。 您可以做的最好是使用onbeforeunload并在单击普通链接时删除该事件：

<script type="text/javascript">
window.onbeforeunload = function() {return "Are you sure?"}
</script>

<a href="somewhere.html" onclick="window.onbeforeunload = null;">Leave</a>

Answer 2

没有办法区分onbeforeunload事件中的导航操作。 您可以通过删除每个链接的onclick处理程序中的window.onbeforeunload处理程序或onsubmit for forms 来禁用页面上所有链接/表单。 但是，您仍然无法判断用户是否单击了后退，转发，书签等，或者在地址栏中键入了新地址。

Answer 3

首先，您需要捕获“beforeunload”事件（之前的答案就是这样）。

// Display browser warning message when back/forward/reload or hyperlink navigation occurs
$(window).on('beforeunload', function(e) {
  console.log('page navigation captured');
  return 'By leaving this page you will lose the data you have entered here.';
});

更重要的是，您希望允许来自某些元素的不间断导航（例如，带有“允许导航”类的链接）。 实现的方法是在单击所选链接时删除事件处理程序。

// Disable capture for certain elements
$('.allow-navigation').on('click', function(e) {
    $(window).off('beforeunload');
    console.log('page navigation allowed');
});

适用于您的类型链接：

<a href="#" class="allow-navigation">Click me</a>

这样您就可以控制页面导航。 浏览器后退/前进/等仍然打开确认框。 但是您选择的链接可以正常运行而不会中断。

希望这可以帮助。

Answer 4

你可以这样做

 $(window).bind("beforeunload", function() { return "Are you Sure you want to leave this page?"; // Return whatever message you want });​ 

如果xx.html是他们历史中的页面而不是你不需要添加任何东西只是返回一条消息它会自动为你添加按钮

编辑：在你认为它没有回答问题http://jsfiddle.net/Lxq93/之前看小提琴

编辑：没有明确的方法只在我知道的后退按钮上显示一条消息我也看了，看到后面按钮上的唯一方法是$(window).bind("beforeunload",function(){return;})和$(window).onbeforeunload = function(){return;}并且当页面刷新或远离当前页面的任何其他导航时它们都会启动。 这是目前2014年可以提供的最佳答案

编辑：

以上是所有卸载事件

http://jsfiddle.net/Lhw2x/85/

一直在通过它的所有较低的对象弄乱它，它不能通过javascript完成，直到有人决定让所有主要的浏览器为每个卸载事件使用特定的名称而不是它只是一个卸载事件

所以答案是否是当他们试图转到不同的页面时，当他们点击确认时，你不能强制导航到特定的页面

并且后退按钮没有特定的事件名称，它在卸载事件中与几个不同的事件共享其事件，因此您无法通过javascript创建后退按钮特定功能