Jquery如何更改點擊鏈接類

您好我想知道如何更改點擊鏈接的類？Jquery如何更改點擊鏈接類

這裏是我的html：

<div id="category_list" class="list-group"> 
     <a href="#" data_category="all_apps" class="list-group-item active"> 
      <span class="badge">2</span>All applications</a> 
       <a href="#" data_category="New1" class="list-group-item"> 
      <span class="badge">1</span> 
         New1 
        </a>   
       <a href="#" data_category="new2" class="list-group-item"> 
      <span class="badge">1</span> 
         new2 
        </a>   
       <a href="#" data_category="new4" class="list-group-item"> 
      <span class="badge">1</span> 
         new4 
        </a>   

    </div>

和我想做的事是設置類當前選擇的 list-group-item active和他人list-group-item

，這裏是我的jQuery，但它不是工作：

$("#category_list a").click(function(e) { 
    var link = $(this); 
    $('#category_list a').each(function(e) { 
     if ($(this) == link) { 
      alert($(this).text()); 
      $(this).addClass('list-group-item active').removeClass('list-group-item'); 
     } 
     else { 
      $(this).addClass('list-group-item').removeClass('list-group-item active'); 
     } 
    }); 
    e.preventDefault(); 
});

來源

2014-01-14 Vardius

active是您要添加的類別/刪除，所以你只需要從所有鏈接刪除它，然後將其添加到點擊一個：

$("#category_list a").click(function(e) { 
    $("#category_list a").removeClass('active'); 
    $(this).addClass('active'); 
    e.preventDefault(); 
});

示例 - http://jsfiddle.net/infernalbadger/UNMY7/

來源

2014-01-14 12:07:33

它可以工作，但鏈接已停用。我的意思是一個鏈接不會將我重定向到所需的頁面。我總是在主頁上。鏈接停止工作。 – user2824371

@ user2824371刪除e.preventDefault（）;線。 –

看來，當我加載一個新頁面時，我的代碼被重新加載（重置）並且主頁仍處於活動狀態。以下是我的作品：我得到頁面的名稱，然後根據頁面的名稱執行代碼。 – user2824371

您可以使用.not()來排除選擇器中的點擊鏈接

$("#category_list a").click(function(e) { 
    $("#category_list a") 
     .not(this) //Exclude current element 
     .removeClass('active'); 

    //Add class with clicked link 
    $(this).addClass('active'); 

    e.preventDefault(); 
});

來源

2014-01-14 12:06:14 Satpal

你可以簡化您的代碼如下：

$('#category_list a').on('click', function(e) { 
    e.preventDefault(); 
    $(this).addClass('active').siblings('a').removeClass('active'); 
});

jsFiddle Demo

來源

2014-01-14 12:09:04 BenM

是的，這個答案是最好的... –

Jquery如何更改點擊鏈接類

回答

相關問題