2011-08-24 37 views
0

當您單擊其父級h3元素時,我正在使用手風琴風格菜單切換下一個div區域。jQuery Accordion需要始終在每個div中顯示錶格

$(document).ready(function() { 
    $('div.accordian-content> div').hide(); 
    $('div.accordian-content> h3').click(function() { 
    $(this).next('div').slideToggle('medium') 
    .siblings('div:visible').slideUp('medium'); 
}); 
}); 

該代碼可以正常工作,具有以下結構。

<div class='accordian-content'> 
<h3>Some title</h3> 
<div>content to be toggled</div> 
</div> 

的問題是,我想在H3和下一格之間使用一個表,我想總是顯示錶,但是當你把一個表中有父H3切換中斷。

<div class='accordian-content'> 
<h3>Covers </h3> 
<table id='covers'>Table content </table> 
    <div>Ajax content</div> 
</div> 

任何意見將不勝感激,因爲我已經花了很多時間在這個愚蠢的事情。

+0

你忘了在jQuery代碼的末尾添加另一個關閉'});'。我認爲這是一個複製粘貼錯誤。 – Blazemonger

+0

你是正確的這是一個複製粘貼錯誤。 –

回答

3

替換next('div')nextAll('div')你應該沒問題。 http://jsfiddle.net/VJCV9/

+0

幾乎可以工作,但在隱藏它們之前會顯示下面的所有div,並且對最終用戶來說看起來很奇怪。 –

+0

這就是你的代碼告訴它要做的事情。在適當的位置用'hide()'替換'slideToggle()'和'slideUp()',或者在樣式表中的div上設置'display:none'。 – Blazemonger

+0

我沒那麼幸運。我認爲問題在於前面提到的代碼塊存在於手風琴內容div內。讓我澄清一下。具有表格的部分在單元格中使用圖像按鈕來填充具有某些內容的下面的div。不具有表格的div部分具有靜態HTML內容。當我嘗試將兩種方法結合使用時,它會破壞包含表格的區域的功能。 –

0

據瞭解,表格不要slideUp()也應該</div be </div>$(this).next('div')需要是.next(table).children(div)

+0