选择具有变量类的元素

时间:2013-07-27 10:38:20

标签: jquery css

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

我的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

3 个答案:

答案 0 :(得分:3)

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

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

添加课程可以使用

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

如果你想替换班级

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

如果你想在当前代码中引用

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

答案 1 :(得分:0)

您可以在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以删除现有的类。

答案 2 :(得分:0)

如果你想通过点击'li'用类替换现有的类,那么它可能会有所帮助..

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