使用Jquery-ui選項卡，使用“父”選項卡集和子選項卡集，如何鏈接“表兄弟”選項卡之間？

Question

給定一個父選項卡集，每個選項卡具有多個子選項卡集。 如何創建在“表兄弟”內容之間鏈接的<a href="#??"></a> ？ 到目前為止，這是我嘗試過的方法，但我並不認為這是正確的！ 我嘗試從選項卡id =＃A.1跳轉到表弟＃E.2的每個鏈接都沒有成功。

腳本：

 <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>

Answer 1

這樣的事情會起作用：

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/

使用Jquery-ui選項卡，使用“父”選項卡集和子選項卡集，如何鏈接“表兄弟”選項卡之間？

問題描述

1 個解決方案

解決方案1
1 已采納 2011-04-13 00:48:57

使用Jquery-ui選項卡，使用“父”選項卡集和子選項卡集，如何鏈接“表兄弟”選項卡之間？

問題描述

1 個解決方案

解決方案1 1 已采納 2011-04-13 00:48:57

解決方案1
1 已采納 2011-04-13 00:48:57