jquery - 深度链接 Jquery 选项卡

Question

我正在寻找一个插件/示例/教程，它将向我展示如何深度链接 jquery 选项卡和嵌套选项卡。有谁知道我在哪里可以找到这样的例子？我想把它添加到一个网站，但我不知道从哪里开始。

Answer 1

Asual jquery address 插件应该为您解决这个问题，还有很多示例http://www.asual.com/jquery/address/或 github https://github.com/asual/jquery-address

或者你可以试试 ben alman 的 jquery bbq 插件

希望有帮助！

Answer 2

所有使用“选择”方法的解决方案都不适用于更高版本的 jquery 选项卡。现在通过将选项 active 设置为选项卡的所需 int（偏移量为 0）来完成。而且这个功能比 jQuery 地址插件更轻量级（可惜功能较少）。

function initTabs() {
var tabIndex = {'yourTabID-1':0,'yourTabID-2':1,'yourTabID-3':2}
var re = /#\w+$/; // This will match the anchor tag in the URL i.e. http://here.com/page#anchor
var match = re.exec(document.location.toString());
match = location.hash;
if (match != null) var anchor = match.substr(1);
for (key in tabIndex) {
    if (anchor == key) {
        selectedTab = tabIndex[key];
        break;
    }
else selectedTab = 0;
}
$( "#tabs" ).tabs( "option", "active", selectedTab );
//following part only if You need copyable deeplinks

$( "#tabs" ).on( "tabsactivate", function( event, ui ) {

    var re = /#\w+$/;
    var url = document.location.toString();
var newHash = 'yourTabID-' + ui.newTab.context.id.substring(6);
window.location.hash = newHash;
} );
}