Question

我不知道如何告诉我的功能，如果我再次点击打开的选项卡，关闭并停止动画。我现在的问题是我的标签关闭，并重做.show（）动作。这里有一个小提琴供你看; http://jsfiddle.net/X2dsS/1/

$('.lst-cours .extrainfo').hide()
$('.lst-cours').click(function(){
    $('.lst-cours .extrainfo').hide("slow")
    $('.lst-cours .extrainfo').removeClass("active")
    $(this).children().find('.extrainfo').show("slow").addClass('active')
});

Answer 1

所以，总而言之，你需要添加一个if语句来检查类，但是你需要在隐藏和显示之前执行此操作。然后保存该值。以下是运行良好的代码，包括一个额外的stop命令，它将阻止nimation一遍又一遍地重复。

$('.lst-cours').click(function(){
    var clickElement = $(this).children().find('.extrainfo');
    var hideOnly = clickElement.hasClass("active");

    $('.lst-cours .extrainfo').stop();
    $('.lst-cours .extrainfo.active').hide("slow");
    $('.lst-cours .extrainfo.active').removeClass("active");        

    if (!hideOnly){
        clickElement.show("slow").addClass('active');
    }
});

查看小提琴： http://jsfiddle.net/2Lqtp/4/

Answer 2

您需要进行一些小改动请参阅以下代码：

    $('.lst-cours .extrainfo').hide()
$('.lst-cours').click(function(){
    if($(this).children().find('.extrainfo').is(":visible"))
    {
        $('.lst-cours .extrainfo').hide("slow");
        $('.lst-cours .extrainfo').removeClass("active");
    }
    else
    {
        $('.lst-cours .extrainfo').hide("slow");
        $('.lst-cours .extrainfo').removeClass("active");
    $(this).children().find('.extrainfo').show("slow").addClass('active');
   }

    });

jQuery隐藏和显示

2 个答案: