手風琴與jQuery

我試圖用jQuery實現手風琴，但是我遇到了問題。當我按下按鈕時，它應該是slideToggle的信息，但它只是滑入和滑出。手風琴與jQuery

我不知道爲什麼它會這樣做，我正在學習，如果有人能幫助我，我會很感激。

這是我的JavaScript：

$(".wrap-faq a").on("click",accordion); 

function accordion() { 
    if($(this).attr("class") != "active"){ 
     $(".wrap-faq li p").slideDown(); 
     $(this).next().slideToggle(); 
     $(".wrap-faq a").removeClass("active"); 
     $(this).addClass("active"); 
     } 
}

我也離開了鏈接到我的jsfiddle演示：http://jsfiddle.net/zZaTf/

來源

2013-04-09 Jhonnatan Gonzalez Rodriguez

你爲什麼不使用內置JQuery用戶界面[手風琴（http://jqueryui.com/accordion/）？ – Jon 2013-04-09 23:35:47

我發現slideToggle很不穩定。也許嘗試使用slideUp和slideDown？ – 2013-04-09 23:38:57

嗨Jhonnatan，你解決了這個問題嗎？如果是這樣，你可以發佈你的答案嗎？非常感謝:) – 2013-04-14 09:58:20

您對.txt-ans-faq類和slide...效果display: none不會隱藏元素上工作。好吧，它會的，但你不會看到它。

來源

2013-04-10 00:16:53

正如Ilia指出的，display: none會阻止您看到您的內容文本，因此請儘快刪除。您可以通過呼叫初始slideUp()來隱藏所有內容。

實際slideToggle可以簡單地以這種方式實現：

$(document).ready(function() { 

    $('.txt-ans-faq').slideUp(0); 

    $('.wrap-faq a').click(function(e) { 
     $(this).next().find('.txt-ans-faq').slideToggle(300); 
    }); 
});

Fiddle

來源

2013-04-11 15:04:56

我更新了手風琴西蒙腳本。

$(document).ready(function() { 

    $('.txt-ans-faq').slideUp(0); 

    $('.wrap-faq a').click(function(e) { 
     $('.txt-ans-faq').slideUp(300);  
     $(this).next().find('.txt-ans-faq').slideToggle(300); 
    }); 
});

http://jsfiddle.net/zZaTf/9/

來源

2013-06-28 23:47:46 jcarlosweb

手風琴與jQuery

回答

相關問題