使用onhashchange或jquery控制Back按钮

Controlling the Back button using onhashchange or jquery

本文关键字:Back 按钮 控制 jquery onhashchange 使用      更新时间:2023-09-26

我需要一些关于如何在使用后退按钮时进行基本控制的指导。

基本上,我需要警告用户,在我的checkout.asp页面上单击后退按钮,他们将丢失已经存在的项目。我需要指示他们使用导航按钮。

我环顾四周,看到有人提到onhashchange事件,但我没能让它发挥作用。

我还尝试了本·阿尔曼的插件:

<script type="text/javascript" src="jquery/js/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="jquery/js/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="jquery/js/jquery.ba-hashchange.js"></script>
<script language="JavaScript" type="text/JavaScript">
$(function(){
    // Bind the event.
    $(window).hashchange( function(){
    // Alerts every time the hash changes!
    alert( location.hash );
    })
    // Trigger the event (useful on page load).
    $(window).hashchange();
});
</script>

这只会在进入页面时触发警报(location.hash中没有值),但我只是想在用户离开时警告他们。如果他们选择留下来,那么让他们按下取消键,让他们留在同一页上。

感谢您的帮助。

使用:

window.onbeforeunload = function() {
   return confirm("you have unsaved data. ok to exit?")
})

为了只在使用后退按钮时显示警告,我们必须在单击有效源时消除警告消息。

var showWarning = true;
window.onbeforeunload = function() {
  if (showWarning) {
    return confirm("you have unsaved data. ok to exit?");
  }
}
function clearWarning() {
  showWarning = false;
} 

现在,只需确保在单击允许的按钮时调用clearWarning()函数。像这样的东西应该起作用:

referenceToElement.addEventListener('onClick', clearWarning(), false);

我还没有对此进行测试,但我可以想象,像这样的东西正是你所需要的。