jQuery手風琴 - 當另一個打開的手風琴窗格打開時如何摺疊

我有一個手風琴，我想要有以下功能：當用戶點擊鏈接展開時，其他展開的鏈接（如果有的話）將坍方。我知道這個功能是在手風琴插件中構建的，但我試圖避免添加另一個庫（jQuery UI）。jQuery手風琴 - 當另一個打開的手風琴窗格打開時如何摺疊

編輯：這裏是我的代碼現在（在這裏是的jsfiddle：http://jsfiddle.net/s2Jfs/2/）：

$('.accordion-toggler').addClass('toggle-plus'); 

    $('.accordion-toggler').click(function() { 
     $this = $(this); 
     if($this.hasClass('toggle-plus')) { 
      $this.removeClass('toggle-plus').addClass('toggle-minus'); 
     } else { 
      $this.removeClass('toggle-minus').addClass('toggle-plus'); 
     } 
     $this.next('.mod-content').slideToggle(); 
    });

「調內容」類附加到應擴大內容/坍塌。現在，如果您展開一個項目，請將其打開，然後單擊另一個項目，即可有多個展開區域。除了活動鏈接之外，我怎樣才能摺疊其他鏈接？

來源

2011-08-04 Paul Erdos

您能否提供http://jsfiddle.net或演示站點？ –

只需要注意，'$'符號不需要預先加載你的Javascript變量'$ this'。您可以簡單地使用'this'來代替。 – 65Fbef05

您可以嘗試將此行移動到頂部，並使用兄弟而不是下一個指定其他所有其他用戶：'$ this.siblings（'.mod-content'）。slideToggle（）;'，然後顯示當前行。你能發佈一些HTML嗎？ – Mrchief

你正在使這種方式比它更復雜。如果您只是想讓其中一個滑下來，而另一些則滑回，請使用以下代碼...

$('.accordion-toggler').click(function() { 
    var targetElement = $(this).next('.mod-content'); 
    targetElement.slideToggle(); 
    targetElement.siblings('.mod-content').slideUp(); 
});

來源

2011-08-04 19:04:21 65Fbef05

謝謝！這工作做我所問。但是，如果需要，我仍然可以選擇全部摺疊（可能會有很長的列表）。 –

我做了一些修改，應該做你想做的。 – 65Fbef05

我添加了您的更改：http://jsfiddle.net/ellenchristine/s2Jfs/4/。但是，現在您可以看到默認行爲並未顯示任何列表，因此您無法真正與鏈接交互。 –

jQuery手風琴 - 當另一個打開的手風琴窗格打開時如何摺疊

回答

相關問題