Question

我想用jquery激活选定的链接。但是我的链接与不同div中的css类组合在一起。

<div class="menu-container">
    <div class="button-group">
        <a href="#" id="manu1">clients</a>
        <a href="#" id="menu2">supplier</a>
    </div>
    <div class="button-group">
        <a href="#" id="menu3">supplier</a>
    </div>
</div>

Jquery就是这样。

$('div.menu-container').on('click','.button-group > a', function(){
      $(this).addClass('active').siblings('a').removeClass('active');
})

我想将所选链接更改为活动 css类，而不是其他链接。但我的 按钮组 正在分隔标签。因此，两个 a 链接显示为活动状态。

工作应用jsfiddle就在这里。

Answer 1

你需要更进一步向上接触它们，试试这个：

$('div.menu-container').on('click','.button-group > a', function(){
  $(this).closest('.menu-container').find('a.active').removeClass('active');
  $(this).addClass('active');
});

Answer 2

您仅删除active元素的siblings类。只需删除所有锚元素的活动类，如下所示。像下面一样更新您的脚本。

 $('div.menu-container').on('click','.button-group > a', function(){
 $('.button-group > a').removeClass('active');
 $(this).addClass('active');
 })

DEMO

编辑：

根据您的新要求if I click the second time to active link, it should be deactive，更新您的jquery，如下所示。

  $('div.menu-container').on('click','.button-group > a', function(){
    if($(this).hasClass('active'))
    {
       $(this).removeClass('active'); 
    }
    else
    {
       $('.button-group > a').removeClass('active'); 
       $(this).addClass('active'); 
    }
 });

DEMO

Answer 3

试试这个：从active下的所有锚链接中删除.menu-container类，然后应用“活跃”＃39; class to current clicked element。

$('div.menu-container').on('click','.button-group > a', function(){
      $('div.menu-container').find('.active').removeClass('active');
      $(this).addClass('active');

});

<强> Demo

Answer 4

试试这样:::

$(document).ready(function(){
    $("a[id ^= 'menu']").on('click',function(){
        $("a[id ^= 'menu']").removeClass('active');
        $(this).addClass('active')
    })


})

DEMO

Answer 5

请参阅解决方案，

$('div.menu-container').on('click','.button-group > a', function(){
    $('div.menu-container').find('a.active').removeClass('active');
    $(this).addClass('active');
})

jquery选择链接激活但不同的div

5 个答案:

编辑：