Question

在我的脚本中有一个jQuery选项卡小部件。当我点击标签时，我想将有效标签class的{{1}}属性更改为li。

我该怎么办？

HTML：

current

jQuery的：

<ul class="nav-content">
    <li class="current first-li"><a href="#tabs-1">tab 1</a></li>
    <li>tab2</li>
</ul>

Answer 1

$("ul.nav-content li").click(function() {
     //you'll probably want to remove all 'current' classes first
     $(".current").removeClass("current")
     $(this).addClass("current")
})

Answer 2

尝试

$("ul.nav-content li").click(function() {
    $(this).addClass("current");
}

Answer 3

$("ul.nav-content li").click(function() {
     $(this).addClass("current");
}

您可以使用addClass添加课程。您也可以使用li关键字引用点击的this。

Answer 4

只需使用适当的方法：http://api.jquery.com/category/manipulation/class-attribute/

Answer 5

您可以使用jQuery的addClass方法添加一个类：

$("ul.nav-content li").click(function() {
    $(this).addClass("current");
});

如果您还要删除该课程（可能还有当前.current的内容），您可以使用removeClass。

但是，如果您确实想要更改课程（不只是添加一个，这是您在问题中说明的内容），则必须使用attr：

$("ul.nav-content li").click(function() {
    $(this).attr("class", "current");
});

这将改变class属性的值，而不是为其附加另一个类名。

Answer 6

$("ul.nav-content li").click(function() {
     $("ul.nav-content li").removeClass("current");
     $(this).addClass("current")
}

我想我们应该在添加当前类之前删除所有当前类。

Answer 7

在单击的选项卡中添加类时，重要的是以单击另一个选项卡的方式执行该操作，该类将从上一个选项卡中删除。
下面的代码将为您完成：

$('ul.nav-content li').click(function(){
    $('ul.nav-content li').removeClass('current');
    $(this).addClass('current');
});

如何在jQuery选项卡小部件</li>中更改<li>的类属性

7 个答案: