Question

我有以下代码，在每个导航栏上显示标签信息。项目点击：

$('#unlock_nav a').click(function() {
    $('.navActive').hide().removeClass('navActive'); 

    var id = $(this).attr('href');
    $(id).show().addClass('navActive');

    return false;       
});

示例HTML：

<div id="unlock_nav">
  <ul> 
    <li id="i1"><a href="#tunic" class="unlock_ni" style="width:53px;height:27px;position:absolute;top:0;left:30px;z-index:3;background-image: url(http://www.mysiteurl/buttn_tunic_white.png);background-repeat:no-repeat; cursor:pointer;"></a>
    </li>        
    <li id="i2"><a href="#jacket"  class="unlock_ni" style="width:67px;height:27px;position:absolute;top:22px;left:30px;z-index:3;background-image: url(http://www. http://www.mysiteurl/buttn_jacket_white.png);background-repeat:no-repeat; cursor:pointer;"></a>
    </li>  
  </ul>
</div>

Answer 1

如果您想突出显示包含navActive课程的点击链接，您只需使用this关键字即可。但是，调用.hide()可能不是您想要的行为。

$('#unlock_nav a').click(function() {
    $('.navActive').removeClass('navActive'); 
    $(this).addClass('navActive');
    return false; // (optional) prevents #anchor appearing in URL bar       
});

在http://jsfiddle.net/u9e3X/8/上试用一个演示。

jquery，如何为选项卡式导航设置活动项目

1 个答案: