Jquery QuestionAnswer with slideToggle

Question

我有一個簡單的問題和答案頁。當用戶點擊一個問題時，答案會顯示在slideToggle（）中。

這是非常微不足道的，但我堅持在Chrome，Safari和Opera上，但工作在Firefox上，前三種是可以使用的，因爲它們是由Gecko的Webkit和Firefox運行的。我使用所有瀏覽器的最新版本。

的代碼是這樣的......

(function() { 
    $('.answer-list').addClass('answer-list-display'); 
    $('.question button').click(function() { 
     $(this).next().slideToggle(300); 
    }); 
}()) 

這是相當瑣碎和它應該工作。

我發現a similar answer（實際上，與我的相同）但如果我使用visibility:hidden，答案的高度仍然存在，這會在問題之間產生差距。我也嘗試通過控制height和animation（）函數來做到這一點，但仍然沒有成功。

所有Webkit瀏覽器首次顯示答案。但其他時間，我必須單擊問題三（！）次才能看到答案。

我知道這是一個微不足道的問題，但我居然花4小時我一生的努力來做到這一點，幾乎沒有睡覺，這真是令人沮喪。

我也發現了一本書我很久以前看一個例子，jQuery的失蹤手冊誰使用toggle()方法有兩個函數作爲參數。仍然沒有在Webkit瀏覽器中遇到同樣的問題。

感謝您的所有答案。

Answer 1

好的。這是答案。

這是我身邊的標記錯誤。我使用無序列表。所有的問題都在li和button是li。答案在一個內部無序列表中。當用戶點擊按鈕時，會顯示內部列表。這沒有用。

然後我切換到div和p爲答案和button的問題和一切運作良好。

每日提示：不要使用任何類型的列表與的slideToggle，fadeToggle（），切換（）或其他動畫使用jQuery。看起來Jquery計算它們太複雜了，我試過了。好吧，主要是。誰知道...