Question

我需要使用jQuery仅在一个特定的菜单项上创建类当前，但是从站点的任何地方我想添加一个链接来实现它。目前我在下面引用了一些jQuery，增加了类＆＃34;当前＆＃34;单击任何菜单项并从上一个活动链接中删除它。

所以我在我的投资组合页面下面有一批投资组合链接，点击后在不同的类别和子类别之间淡出，目前你可以从网站的任何地方点击它们，然后进入投资组合页面，但是目前没有将当前类添加到porfolio菜单项。

下面是链接，当点击任何一个链接时，它们必须始终只影响标题菜单项目组合，这将是＆＃34; data-goto =＆＃34; 2＆＃34;并将类电流添加到标题菜单li，如下图所示：

<div id="togglelinks" class="gallery-toggle">
  <ul>
    <li class="people">
      <a class="toggle pt-trigger" href="#" data-animation="59" data-goto="2" data-toggle="#people"></a>
    </li>
    <li class="beauty">
      <a class="toggle pt-trigger" href="#" data-animation="59" data-goto="2" data-toggle="#beauty-fashion"></a>
    </li>
    <li class="stills">
      <a class="toggle pt-trigger" href="#" data-animation="59" data-goto="2" data-toggle="#stills">
      </a></li>
    <li class="mobile">
      <a class="toggle pt-trigger" href="#" data-animation="59" data-goto="2" data-toggle="#mobile">
      </a>
    </li>
    <li class="specials">
      <a class="toggle pt-trigger" href="#" data-animation="59" data-goto="2" data-toggle="#specials">
      </a>
    </li>
  </ul>
</div>

上述链接影响的菜单项：

<a class="pt-trigger" data-animation="52" data-goto="2" data-toggle="#people"><li class="menu"><span>Portfolio</span></li></a>

包含所有菜单项的标题菜单结构HTML：

<div class="dotstyle dotstyle-tooltip pt-trigger-container">
  <ul>
    <a class="pt-trigger" data-animation="58" data-goto="1"><li class="menu current"><span>Home</span></li></a>
    <a class="pt-trigger" data-animation="52" data-goto="2" data-toggle="#people"><li class="menu"><span>Portfolio</span></li></a>
    <a class="pt-trigger" data-animation="51" data-goto="3"><li class="menu"><span>Production</span></li></a>
    <a class="pt-trigger" data-animation="48" data-goto="4" ><li class="menu"><span>About</span></li></a>
    <a class="pt-trigger" data-animation="47" data-goto="5"><li class="menu"><span>Contact</span></li></a>
    <a class="pt-trigger" data-animation="56" data-goto="6"><li class="menu"><span>Impressum</span></li></a>
  </ul>
</div>

到目前为止主菜单的jQuery仅在您单击主菜单链接时才有效：

jQuery("a.pt-trigger li").click(function(){
  jQuery("a.pt-trigger li").removeClass("current");
  jQuery(this).addClass("current");
});

Answer 1

试试这个？

$(document).ready(function(){
    $("a.pt-trigger").click(function(){
        var goto = $(this).data('goto');
        $("div.dotstyle a.pt-trigger li").removeClass("current");

        $("div.dotstyle a").eq(goto-1).find('li').addClass("current");
    });
 });

检查演示http://jsfiddle.net/yeyene/4KSSL/1/

只有Portfolio和Production菜单适用于此演示，仅适用于goto = 2和goto = 3的2个子菜单。

如果您拥有所有转到1,2,3,4和5的所有子菜单。这将适用于所有人。

单击时，可以从网站上的任何位置将类当前添加到单个目标菜单项

1 个答案:

检查演示http://jsfiddle.net/yeyene/4KSSL/1/