3

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

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

4

4 回答 4

6

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

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

<a href="somewhere.html" onclick="window.onbeforeunload = null;">Leave</a>
于 2010-11-15T13:04:08.490 回答
1

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

于 2010-11-15T13:02:50.503 回答
0

首先，您需要捕获“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.';
});

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

// 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>

这样您就可以控制页面导航。浏览器后退/前进/等仍然打开确认框。但是您选择的链接将不会受到任何干扰。

希望这可以帮助。

于 2015-07-07T12:03:59.493 回答
-2

你可以这样做

$(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创建后退按钮特定功能

于 2014-05-21T17:36:09.850 回答