jQuery：更改类的单击事件

问题描述：

我正在使用jQuery的面板来显示和隐藏。它上面有一个小箭头图像，它也在隐藏和显示上发生变化。我的代码是jQuery：更改类的单击事件

<div class="trigger-m"><span id="toppanelarrow">&nbsp;</span></div>

现在当面板打开时，类会添加到to_up，面板关闭时会添加to_down。我有相应的上下箭头图像。

有人可以帮助我添加一个jQuery on'toppanelarrow'的点击事件，所以一个新的类被添加到跨度。

我试过$().addClass().removeClass()但这没有奏效。

更新：请找到小提琴实施http://jsfiddle.net/B5QUj/4/

感谢

显示代码和HTML（在HTTP：//的jsfiddle .net如果可能的话） – 2012-03-14 14:07:16

不好意思回复迟到。我已经用jsfiddle编码了，这里是链接。 http://jsfiddle.net/B5QUj/3/ – Aditya 2012-03-14 18:28:26

答

你应该试试（这增加了类to_down如果跨度有to_up

$('#toppanelarrow').click(function(){ 
    if($(this).hasClass('to_up')){ 
    $(this).addClass('to_down').removeClass('to_up'); 
    }else{ 
    $(this).addClass('to_up').removeClass('to_down'); 
    } 
});

这也可以写成

类

$('#toppanelarrow').click(function(){ 
     $(this).toggleClass('to_up to_down').; 
});

尼古拉，我也试过这个，但它不工作。 – Aditya 2012-03-14 14:11:14

@Aditya你确定，它似乎在这里工作http://jsfiddle.net/q8dGy/1/ – 2012-03-14 14:18:48

答

此外，您可以尝试

$(this).toggleClass('classname');

答

尝试：

$("#yourClassID").addClass("cssClass");

答

如果你有元件上的一个类来开始：

$('#foo').on('click', function() { 
    $(this).toggleClass('to_up to_down'); 
});

是你所需要的。

演示：http://jsfiddle.net/kXNk8/

答

为了得到想要的效果：

HTML：

<input id="btn" type="button" value="click it" /> 

<div class="box"> 
    <span>Tekst</span> 
</div>

JS：

$(document).ready(function(){ 

    $("#btn").click(function(){ 
     $(".box").toggle(); 
    });  
});

jQuery：更改类的单击事件

相关推荐