如何将导航菜单链接到jQuery选项卡

Question

我有一个标题导航菜单，我需要链接到jQuery选项卡 - 因此链接必须在同一页面上打开一个选项卡并链接到选项卡并从另一页打开它们。我从另一页面开始工作，但不知道如何在同一页面上打开具有外部链接的特定选项卡，而不包括每个子页面的单独标题，该标题使用导航栏中链接的标签。

这是一个Jsfiddle，但它有问题，因为导航中的链接导致外部文件。要点是，该导航都应该从外部网页，然后在同一页上也只是打开一个标签

http://jsfiddle.net/vbonoL5b/

这是菜单的一部分（其2级UL菜单）

工作

<div id="nav"> 
    <ul><li><a href="index.php?lang=<?php echo $lang ?>">Home</a> 
        <ul> 
         <li><a href="index.php?lang=<?php echo $lang ?>#tabs-1" class="tabLink">Concept</a></li> 
         <li><a href="index.php?lang=<?php echo $lang ?>#tabs-2" class="tabLink">Benefits</a></li> 
        </ul> 
    </li></ul> 
</div> 

的标签是非常简单的jQuery标签：

<div id="icon-tabs"> 
       <ul> 
       <li><a href="#tabs-1" id="item1" ><div class="icon-tab"><h4>Concept</h4><img src="img/concept.png"></img></div></a></li> 
       <li><a href="#tabs-2" id="item2" ><div class="icon-tab"><h4>More</h4><img src="img/benefits.png"></img></div> </a></li> 
       </ul> 
     <div id="tabs-1"> 
      .... 
     </div> 
</div> 

我尝试过的一些事情，但我从来没有设法得到的链接在同一页上打开：

$(function() { 
//Load tabs 
$("#icon-tabs").tabs(); 

//Check url and open appropriate tab (for when you come from external site) 
if(document.location.hash!='') { 
    //get the index from URL hash 
    tabSelect = document.location.hash.substr(1,document.location.hash.length); 
    $("#icon-tabs").tabs('select',tabSelect-1); 
} 

//Use the nav to open local tabs?? I tried .onclic events based on ID and class of links in menu, but never got it working. 
// For example: 
$('.tabLink').click(function(e) { 
    if(document.location.hash!='') { 
    (e).preventDefault(); 
    //get the index from URL hash 
    tabSelect = document.location.hash.substr(1,document.location.hash.length); 
    $("#icon-tabs").tabs('select',tabSelect-1); 
    } 
    }); 
}); 

我不知道我在做什么错。任何帮助或建议表示赞赏！

Answer 1

使用以下代码。 index函数直接使用“ID”属性的元素索引

$(function() { 
//Load tabs 
    $("#icon-tabs").tabs(); 

    //Check url and open appropriate tab (for when you come from external site) 
    if(document.location.hash!='') { 
    //get the index from URL hash 

    tabSelect = $('#icon-tabs div').index($(document.location.hash)); 
    $("#icon-tabs").tabs('select',tabSelect);  } 

    //Use the nav to open local tabs?? I tried .onclic events based on ID and class of links in menu, but never got it working. 
    // For example: 
    $('.tabLink').click(function(e) { 
    if(document.location.hash!='') { 
     e.preventDefault(); 
    tabSelect = $('#icon-tabs div').index($(document.location.hash)); 
    $("#icon-tabs").tabs('select',tabSelect); 
    } 
    }); 

});