JavaScript 的历史回钩答案

【问题标题】：History back hook on JavaScriptJavaScript 的历史回钩
【发布时间】：2012-05-22 14:00:20
【问题描述】：

有没有办法提供像 onHistoryBack 这样的钩子？我目前正在使用 history.js 和

History.Adapter.bind (window, 'statechange', function () {});

但我无法询问用户是否按下了 history.back() 或者它是否是 History.pushState() 调用的结果......有什么想法吗？

【问题讨论】：

标签： javascript jquery history.js

【解决方案1】：

我这样做的方法是在每次点击实际网站时将一个变量设置为 true。然后 statechange 事件会检查这个变量。如果这是真的，他们使用了网站上的链接。如果它是假的，他们点击了浏览器的后退按钮。

例如：

var clicked = false;

$(document).on('click','a',function(){

    clicked = true;

    // Do something

});

History.Adapter.bind (window, 'statechange', function () {

    if( clicked ){
        // Normal link
    }else{
        // Back button
    }

    clicked = false;

});

希望有帮助:)

【讨论】：

谢谢@will 我刚刚使用像你这样的方法解决了这个问题，但是我在“单击”修改之间包装了我的 History.pushState(...) 调用，以防止执行“statechange”钩子

【解决方案2】：

所有状态都存储在History.savedStates 中。每次返回时都会添加另一个状态。所以理论上你可以测试History.savedStates 看看是否History.savedStates[History.savedStates.length - 2] == currentState。这将表明用户从步骤 a 到步骤 b，然后返回到步骤 a。但是，用户可以通过返回按钮以外的其他方式到达那里 - 因此您可能需要将其与用户事件结合使用。

您还可以使用History.getStateByIndex 方法返回已保存的状态。

【讨论】：