jquery - 当使用参数更新 URL 时，Pjax 后退按钮不起作用

Question

当我使用一些参数(如 ?page=2)手动更新 url 时，pjax 不会识别它:

window.history.replaceState(null,document.title,"?page=2");

我也尝试过使用 pjax

$.pjax({url: "?page=2", container: (container || '#null'), replace: true, dontRequest: true})

(请注意，我添加了 dontRequest 参数，这样我就可以执行“假”pjax 调用，该调用实际上不会触发 .ajax，但仍会更新 url，但没有成功)

要在实时站点上复制此内容:

1. 转到http://2u.fm (点击退出模式)
2. 向下滚动直至添加 ?p=2
3. 点击热门
4. 在浏览器中按“返回”

请注意，没有任何反应...现在再次按回键，您将看到它起作用了。这是因为我使用 ReplaceState 将 URL 更新为 ?p=2。我将如何使这项工作能够识别这些？ params...我尝试自定义 pjax 但没有成功。

Answer 1

这是一个老问题，但我会给任何像我一样来到这里的人提供答案。

当您在页面上手动使用pushState或replaceState时，Pjax无法正常工作。当它遇到这样的状态时，它根本不做任何事情。因此，当您按后退/前进按钮进入此类页面时，pjax:popstate 事件不会触发，也不会发生任何事情。

解决方法是使用 $.pjax.state 作为 PushState 和 ReplaceState 的状态对象参数

history.pushState($.pjax.state, null, href)

和

history.replaceState($.pjax.state, null, href)

github上有一些关于这个问题的问题: issue/381 , issue/495