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);
    }
  });

});

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

1 个答案: