如何使jquery嵌套选项卡链接工作？

我遇到了Jquery标签UI的问题。

 $(document).ready(function() { $('.tabs').tabs(); $('.subtabs').tabs(); }); 
 
 
Tab1
 
Tab2
 
 
 
 
 
Subtab1
 
Subtab2
 
 
 Some content1 
 
 Some content2 
 
 
 
  

现在，当我尝试访问类似page.html＃subtab1的子标签时，它不起作用，但page.html＃tab1正常工作。 我究竟做错了什么？ 基本上我需要使用URL打开子选项卡。

谢谢

Answer 1

你缺少

，它会产生一个jQueryexception。 尝试将其添加到代码中，您的链接将起作用。

Answer 2

我有同样的问题。 我找到了一个JS修复程序。 请注意，在您的示例中，您在第一个选项卡中有子选项卡，第一个选项卡是打开的默认选项卡。 使用我的修复程序，您可以将子选项卡放在主选项卡的任何内容中。 检查Plunker的工作示例。

http://run.plnkr.co/plunks/Wr91Bm/#subtab2

我创建了函数openParentTab()并在创建$('.tabs, .subtabs').tabs();后立即调用它$('.tabs, .subtabs').tabs();

 function openParentTab() { locationHash = location.hash.substring( 1 ); console.log(locationHash); // Check if we have an location Hash if (locationHash) { // Check if the location hash exsist. var hash = jQuery('#'+locationHash); if (hash.length) { // Check of the location Hash is inside a tab. if (hash.closest(".tabContent").length) { // Grab the index number of the parent tab so we can activate it var tabNumber = hash.closest(".tabContent").index(); jQuery(".tabs.fix").tabs({ active: tabNumber }); } } } } 

如果您有一个大页面，并且您发现焦点jQuery(".tabs.fix").tabs({ active: tabNumber });正确的子选项卡上，则可以在jQuery(".tabs.fix").tabs({ active: tabNumber });下面添加以下内容jQuery(".tabs.fix").tabs({ active: tabNumber });

 hash.get(0).scrollIntoView(); setTimeout(function() { hash.get(0).scrollIntoView(); }, 1000); 

请参阅代码： http ： //plnkr.co/Wr91Bm