使用jQuery UI选项卡重定向到另一页

Question

我的页面上有jQuery UI选项卡，但我想将它们用作页面之间的导航，而不是像显示和隐藏div一样。所以基本上我仍然想使用jQuery UI选项卡，但为了全局导航和正确的高亮显示。

任何人都可以帮助我吗？

我可以导航，但我仍然有点卡住突出显示在下面的页面中正确的项目。任何想法如何实现？

$(document).ready(function() { 
    var iSelectedTab = $('div#tabs ul a').filter('a[href="#"]'); 
    $("#tabs").tabs({ 
    selected: iSelectedTab, 
    select: function (e, ui) { 
     window.location.href=ui.tab.href; 
    } 
    }); 
}); 

但它不工作。有任何想法吗？

Answer 1

我不认为在这种情况下使用该标签的点...但回答你的问题......

说，我们是在page1.html - 在您需要的标签和0〜是积极的，你的标签结构应该是这样的（是的 - 它不会尊重jQuery UI的选项卡的标准结构）：

<div id="tabs"> 
    <ul> 
     <li><a href="#tabs-1">Page 1</a></li> 
     <li><a href="page2.html#tabs-2">Page 2</a></li> 
     <li><a href="page3.html#tabs-3">Page 3</a></li> 
    </ul> 
    <div id="tabs-1">This is page 1</div> 
</div> 

注意，有在此页无其他标签的容器。 page2.html将具有相同的结构与上述

<div id="tabs"> 
    <ul> 
     <li><a href="page1.html#tabs-1">Page 1</a></li> 
     <li><a href="#tabs-2">Page 2</a></li> 
     <li><a href="page3.html#tabs-3">Page 3</a></li> 
    </ul> 
    <div id="tabs-2">This is page 2</div> 
</div> 

在这一点上，你不需要任何特殊的JS代码，

$("#tabs").tabs({ 
    select: function (e, ui) { 
     window.location.href=ui.tab.href; 
    } 
});