當我打開一個手風琴時如何關閉多個部分中的所有其他手風琴？

Question

編輯： 我發現不使用jQuery UI手風琴的解決方案： jQuery切換（單擊以顯示一個div，而隱藏其他div）

JSFiddle： http : //jsfiddle.net/sy34v/ （不要介意左側的空格，這可能是因為禁用了列表編號）

如果我打開一個手風琴，在“列表窗口1”上說，即使我在“列表窗口2”中單擊另一個手風琴，它也保持打開狀態。

因此，如果我有4個手風琴部分，則可以打開4個手風琴。 如何使整個頁面上只有一個手風琴可以打開，而如果我打開另一只手風琴則將關閉它呢？ 它僅在手風琴部分內部起作用。

這是jQuery：

$(document).ready(function () {
    $(".listWindow").accordion({
        header: ".accordionHeader",
        collapsible: true,
        active: false
    });
});

Answer 1

試試這個solutin

http://jsfiddle.net/rm7fD/

$(document).ready(function () {
var titleClicked = "";

$(".listWindow").accordion({
    header: ".accordionHeader",
    collapsible: true,
    active: false,
    activate: function( event, ui ) {
        var title = $(this).find(".title").html(); 
        setTimeout(function(){
            if(titleClicked == title){
                $(".listWindow").each(function(){
                    if ($(this).find(".title").html() != title){                       
                        $(this).accordion("option", "active", false);
                    }
                });
           }
        }, 100);
    }
});  

$(".siteTitle").click(function () {
    event.stopPropagation();        
});

$(".accordionWrapper").click(function(){        
    titleClicked = $(this).closest(".listWindow").find(".title").text();
});

});

Answer 2

您嘗試過這種方法嗎？

$(function() {
    var $accordions = $(".listWindow").accordion({
        header: ".accordionHeader",
        collapsible: true,
        active: false
    }).on('click', function() {
        $accordions.not(this).accordion('activate', false);
    });
});

基於： 如果在jQuery中打開了其他手風琴，則關閉手風琴