JQuery刪除和添加類

我試圖使用JQuery添加/刪除類作爲使用鏈接來切換我的網站上的主要內容divs的功能的一部分。JQuery刪除和添加類

這裏是我的JavaScript：

$(document).ready(function() { 
    var clickHandler = function (link) { 
    $('.tab').hide(); 
    $('#options_' + link.data.id).show(); 
    $('.selected').removeClass('selected'); 
    $(this).addClass('selected'); 
    } 

    $('.link1').bind('click', {id:'1'}, clickHandler); 
    $('.link2').bind('click', {id:'2'}, clickHandler); 
    $('.link3').bind('click', {id:'3'}, clickHandler); 
});

這裏是我的切換的div（這部分作品）的HTML：

<div id="options_1" class="tab"> 
<h3>Your Feed</h3> 
<?= $userFeed ?></div> 

<div id="options_2" class="tab"> 
<h3>All Recent Activity</h3> 
<?= $feed ?> 

</div> 
<div id="options_3" class="tab"> 
<h3>Trends</h3> 
Coming Soon! 
</div>

，這裏是在鏈接的HTML控制div切換的頁面的側邊欄部分。應該從選項1中刪除「selected」類並將其添加到用戶選擇的其他任何鏈接，但這不會發生。班級沒有任何變化。

<ul id="feedOptions"> 
<li><a href="#" id="1" class="link1" class="selected">Your Feed</a></li> 
<li><a href="#" id="2" class="link2">All Activity</a></li> 
<li><a href="#" id="3" class="link3">Trends</a></li> 
</ul>

就像我上面說的，我不能讓'selected'類改變。有什麼建議麼？

來源

2010-08-03 tchaymore

您有多個class屬性，而不是這一個單一的元素，：

<a href="#" id="1" class="link1" class="selected">Your Feed</a>

你應該有這樣的（單一屬性，單獨的類中間有空格）：

<a href="#" id="1" class="link1 selected">Your Feed</a>

來源

2010-08-03 20:59:46

啊，當然！非常感謝，雖然我覺得有點像白癡。你不會相信我看了多久，忘記了我已經增加了一個「班級」。奇蹟般有效。 – tchaymore 2010-08-03 21:07:48

$('.link1,.link2,.link3').bind('click', function() { $(this).toggleClass('selected'); });

來源

2010-08-03 21:00:13 zerkms

這不會切換其他元素上的類（刪除之前選擇的）:) – 2010-08-03 21:03:39

@Nick：是的。這不是他的問題的完整答案，但提示他如何使他的代碼更短;-) – zerkms 2010-08-03 22:30:24

JQuery刪除和添加類

回答

相關問題