Javascript / jQuery仅在浏览器后退/前进按钮单击时检测哈希更改

是否可以仅在浏览器历史记录更改(即后退或前进按钮)上检测哈希更改?

我已经看到了onBeforeUnload事件,但是这个事件不会触发哈希更改,因为窗口没有卸载。

散列事件显然会随着哈希更改而触发。 任何修复? 优选地,没有插件。 我见过jQuery历史插件,但我正在寻找最简单的解决方案。

谢谢您的帮助。

看一下window.onhashchange事件。

但是,目前并非所有浏览器都支持它。 在这里查看BA jQuery Hash Change Plugin。 如果您选择最终使用插件,它可能会工作。

我希望这有帮助!

每当我的导航被触发时,我最终都会标记一个标志,如果标记了标记,hashChange事件将忽略它,否则它将处理它,就好像它是一个后退/前进事件。

我认为克里斯问的是,只有当您浏览浏览器历史记录(后退/前进)按钮时,window.onhashchange事件才能正常工作。

答案=否……但您可以在函数中添加if语句。
我会这样做:

$('.nav').click(function() { //on the onclick event for your nav add a class $(this).addClass('navClick'); // before you change the hash. window.location.hash = 'state' + $(this).html(); }); function getLocationHash() { return window.location.hash.substring(1); } window.onhashchange = function(e) { // if element does not exist with your if ($('.navClick').length == 0) { // 'navClick' class then check hash switch(getLocationHash()) { case 'state1': execute code block 1; break; case 'state2': execute code block 2; break; default: code to be executed if different from case 1 and 2; } } else { // removes the class if it does $('.navClick').removeClass('navClick'); } }; 

我在我的网站上做了类似的事情

这些都是动态变化的内容。 我仍然使用window.location.hash来跟踪站点状态。 如果您浏览网站,然后在网站进入历史记录后开始使用后退按钮进行导航,则会动态更改状态,就像用户实际点击导航一样,而不是之后需要重新加载页面。 如果您使用历史记录进行导航,它只会检查哈希值。

我建议采用不同的方法。 让我们说你有一个链接到某个页面(但使用AJAX没有刷新)。 单击该链接后,您可以将哈希值更改为您喜欢的任何内容。 现在,当用户单击后退按钮时,哈希值会更改回用户点击链接之前的原始内容…但您可以做的是检查是否在链接或按钮(或其他任何内容)上触发了单击事件要检查的选择器/事件)。 如果它被解雇,您知道该请求来自页面本身的点击。 如果没有您正在检查的事件被触发,您知道点击来自后退或前进按钮。

您可以做的另一件事是在更改时为哈希添加后缀(根据您对任何事件触发的检查,从后退或前进按钮)。 因此,如果您有#pageTitle的哈希值,您可以将其转换为#pageTitle_chrome以指示哈希值已从后退按钮或前进按钮更改。

然后,当你检查哈希时,你可以看看它是否包含_chrome来检测它是什么样的哈希变化。

您不能使用哈希,甚至使用HTML5 History API执行此操作。 没有与用户单击后退或前进按钮专门关联的事件。 您可能需要对原始问题采用不同的方法,除非在客户端计算机上安装某种类型的扩展是可行的。