使用Jquery-ui选项卡，使用Parent选项卡集和子选项卡集，如何链接选项卡'cousins'？

给定一个父标签集，每个标签具有多个子标签集。如何创建链接“堂兄弟”内容的<a href="#??"></a>？这是我到目前为止所尝试的，我不认为它是正确的！我试图从tab id =＃A.1跳到堂兄＃E.2的每个链接都没有成功。使用Jquery-ui选项卡，使用Parent选项卡集和子选项卡集，如何链接选项卡'cousins'？

脚本：

<script> $(document).ready(function(event){ 
     var tabs = $("#parentTabSet, #childSet1, #childSet2").tabs(); 
    //here's what i've tried so far: 
     $(".interTabLink").click(function(event){ 
    //this gets the `<ul><li><a href="#someId">tab user wants to see</a></li></ul>` 
      var ulLink =$(".anytabset").find("[href='"+$(this).attr("href")+"']"); 
//filter the 'var tabs' array to only have the tabset we want. 
      tabs.filter("#"+ulLink.closest("div").attr("id")).tabs("select", $(this).attr("href")); 
     }); 
     }); 
    </script>

HTML：

<body> 
<div id="parentTabSet" class="anyTabSet"> 
<ul> 
    <li><a href="#A">parent A</a></li> 
    <li><a href="#B">parent B</a></li> 
    <li><a href="#C">parent C</a></li> 
    <li><a href="#D">parent D</a></li> 
    <li><a href="#E">parent E</a></li> 
</ul> 
<div id="A"> 
    <div id="childset1" class="anyTabSet"> 
    <ul> 
     <li><a href="#A.1">foo</a></li> 
     <li><a href="#A.2">bar</a></li> 
     </ul> 
     <div id="#A.1"><p>insert your latin here</p></div> 
     <div id="#A.2"> 
<!--- this will link to cousin #E.2, with parent tab E ---> 
<a href="#E.2" class="interTabLink">more information here</a> 
     </div> 
    </div> 
</div> 
<div id="B"> 
<p>insert your latin here</p> 
</div> 
<div id="C"> 
<p>insert your latin here</p> 
</div> 
<div id="D"> 
<p>insert your latin here</p> 
</div> 
<div id="E"> 
<div id="childset2" class="anyTabSet"> 
    <ul> 
     <li><a href="#E.1">foo</a></li> 
     <li><a href="#E.2">bar</a></li> 
     </ul> 
     <div id="#E.1">stuff</div> 
     <div id="#E.2">here</div> 
    </div> 
</div> 
</div> 
</body>

来源

2011-03-14 DefyGravity

我没有时间给现在完整的答案，但我h大家以前做过类似的事情，你可以在这里看到一个有效的例子：http://english.byu.edu/schol_awards/。如果您希望获得更多帮助，请在本周晚些时候再提供一些帮助。 – undefined 2011-03-22 04:24:55

像这样的工作：

var mytabs = $('.anyTabSet').tabs(); 

$(".interTabLink").click(function(event){ 
    event.preventDefault(); 
    var id = $(this).attr("href"); 
    var tab = mytabs.find("li [href='"+id+"']"); 
    if (tab.length) { 
     var tabset = tab.closest('.anyTabSet').tabs("select", id); 
     if (tabset.length) { 
      id = id.replace(/_[0-9]/,''); 
      tabset.parents('.anyTabSet').tabs("select", id);  
     } 
    } 
});

工作例如：http://jsfiddle.net/petersendidit/uz7d5/

来源

2011-04-13 00:48:57 PetersenDidIt

就是这样。 – DefyGravity 2011-04-19 20:08:57

使用Jquery-ui选项卡，使用Parent选项卡集和子选项卡集，如何链接选项卡'cousins'？

回答

相关问题