jQuery的手風琴 - 收起上再次點擊

所以，我有以下代碼：jQuery的手風琴 - 收起上再次點擊

$(".btn-slide-1").click(function(){ 
    $('div[id^="panel"]').slideUp("slow"); 
    $('ul#menu li a').removeClass("active"); 
    $("#panel-about").slideToggle("slow"); 
    $(this).toggleClass("active"); return false; 
}); 

$(".btn-slide-2").click(function(){ 
    $('div[id^="panel"]').slideUp("slow"); 
    $('ul#menu li a').removeClass("active"); 
    $("#panel-products").slideToggle("slow"); 
    $(this).toggleClass("active"); return false; 
}); 

$(".btn-slide-3").click(function(){ 
    $('div[id^="panel"]').slideUp("slow"); 
    $('ul#menu li a').removeClass("active"); 
    $("#panel-specs").slideToggle("slow"); 
    $(this).toggleClass("active"); return false; 
});

從本質上講，我希望得到這個精簡的，但是當你點擊一個類來打開該股利它是所有與此有關。它一切正常，但如果我再次點擊相同的項目，它只是崩潰，然後再次立即重新打開。

來源

2012-07-25 Palemo

您可以在條件檢查中對其進行變形。

$(".btn-slide-1").click(function(){ 
    if (!$(this).hasClass("active")) { 
     $('div[id^="panel"]').slideUp("slow"); 
     $('ul#menu li a').removeClass("active"); 
     $("#panel-about").slideToggle("slow"); 
     $(this).toggleClass("active"); return false; 
    } 
});

來源

2012-07-25 03:25:10 Mifeng

不，是s直到崩潰，然後再次打開它。 – Palemo 2012-07-25 03:42:37

這就是偉大的傢伙，謝謝！ – Palemo 2012-07-25 03:51:36

@Palemo看看http://jsfiddle.net/3aH5r/它應該工作。 – Mifeng 2012-07-25 03:55:43

我覺得你的jQuery代碼看起來應該是這樣

i$(".btn-slide-1").click(function(){ 
    var currentActive = $(this).hasClass("active"); 
    $('div[id^="panel"]').slideUp("slow"); 
    $('ul#menu li a').removeClass("active"); 

    if(!currentActive){ 
     $("#panel-about").slideToggle("slow"); 
     $(this).toggleClass("active"); 
    } 
    return false; 
});

發生的事情是你向上滑動所有面板和消除對「一個」標籤所以當這些線路執行「活躍」類，

$("#panel-about").slideToggle("slow"); 
$(this).toggleClass("active");

面板目前正在崩潰的話，會的slideToggle再次展開

來源

2012-07-25 03:41:42 Leon

jQuery的手風琴 - 收起上再次點擊

回答

相關問題