jquery - 选择具有变量类的元素

Question

我无法为下面的行选择具有特定值类的元素

我的 HTML 是

<ul class=nav>
   <li class="home">
       <a href="">HOME </a>
   </li>
   <li class="bye">
       <a href="">BYE </a>
   </li> 
</ul>

<script>
$("ul.nav li").click(function(e) {
   $('.home').addClass('.newhome').removeClass('.home');
    alert("done");
});
</script>

我的 CSS 是

li.newhome {
    background: #678fef no-repeat;
     color:#fff;
    }

li.home{ 
 background: #666 no-repeat;

这是一个JSFiddle。

Answer 1

var lastclickedclass=".home";
var updatedlastclass=".newhome";

$(lastclickedclass)相当于$('.home')

添加课程，您可以使用

$('.home').addClass('.newhome');

如果你想替换类

$('.home').addClass('.newhome').removeClass('.home');

如果您想在当前代码中引用，请使用

$(this).find('.home').addClass('.newhome');

Answer 2

您可以在http://jsfiddle.net/ELbCx/15/看到清理后的小提琴。

您刚刚复制和粘贴的内容甚至不是 jQuery 的工作方式。如果 jQuery 无法读取它，它就无法执行它。

代码在这里：

HTML

<ul class=nav>
    <li class="home">HOME</li>
    <li class="bye">BYE</li> 
</ul>

jQuery

$("ul.nav li").click(function(e) {
    $(this).removeClass('home bye');
    $(this).addClass("newHome");
});

编辑：添加removeClass以删除现有类。

Answer 3

如果您想通过单击“li”将现有类替换为一个类，那么它可能会有所帮助..

$("ul.nav li").click(function(e) {
        $(this).removeClass($(this).attr('class')).addClass("newHome");
 });