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删除和添加类

回答

相关问题