Jquery Post UI选项卡未正确链接到页面锚点

我正在使用页面锚点将用户从菜单引导到特定选项卡。 但是，当您在页面上显示选项卡时，单击链接不会重定向。 它只是更改URL中的哈希值。 知道如何解决这个问题吗？

示例链接

http://www.website.com/page#1

这是在WordPress btw。

jQuery(document).ready(function($){ $(function() { $( "#tabs" ).tabs(); if(document.location.hash!='') { //get the index from URL hash tabSelect = document.location.hash.substr(1,document.location.hash.length); $("#tabs").tabs('select',tabSelect-1); } }); }); 

Answer 1

您需要使用jquery监听hashchange事件以检测哈希何时更改，因为这些更改不会触发页面加载。 有关详细信息，请参阅此答案： On – window.location.hash – 更改？

编辑 – 更多信息

正如上面链接中的答案所说，对于不同的浏览器，这种方式有所不同，最终你将从Ben Alman的脚本中获得最佳结果（正如Joseph在下面提到的那样）。 但是让我们分解吧。

这是一个将哈希值推送到h1标记的简单示例：

         
 1 2 3   

此示例适用于大多数现代浏览器，包括IE8，但需要注意的是，只更改URL中的哈希值不会在IE中创建新的历史记录条目。 由用户交互引起的哈希更改将创建历史记录条目。

如果你打算支持IE7及以下版本，那么最好的方法是使用Ben的插件 ，这会稍微改变我们的代码，因为不是使用bind来监听你订阅插件创建的事件函数的事件：

          
 1 2 3   

Answer 2

您应该使用Ben Alman的jQuery插件来监听散列更改事件，因为旧版浏览器并不完全支持它。

http://benalman.com/news/2010/01/jquery-bbq-v11-and-jquery-hashchange-event-v10/

例证：即使你手动轮询哈希，后退按钮也不会在IE6中工作。 那是因为IE6不会在hashchange上推送新的历史状态。 Ben的插件处理这个问题（通过拥有一个看不见的iframe），以及更多的细微差别。