當側邊欄關閉時jQuery Accordion選項卡應該關閉

Question

我有側邊欄，當單擊加號圖標時它會打開，並且它有一個手風琴，可以打開並關閉邊欄而不關閉手風琴。手風琴保持開放。

如果側欄關閉，手風琴應該自動關閉，有沒有辦法？

請參閱下面的代碼： https://jsfiddle.net/bob_js/kefq1bxo/

HTML：

<div class="container"> 
    <i class="glyphicon glyphicon-plus-sign cd-btn"></i> 
</div> 

<div class="cd-panel from-right"> 
      <header class="cd-panel-header"> 
       <a href="#0" class="cd-panel-close"></a> 
      </header> 
      <div class="cd-panel-container"> 
     Content 
     <div class="nav-accord2"> 
        <div id="accordion"> 
      <h3 >Header</h3> 
      <div>Text 1</div> 
    </div> 
</div> 

的jQuery：

$(".glyphicon-minus-sign, .glyphicon-plus-sign").click(function(){ 
    $(this).toggleClass("glyphicon-minus-sign glyphicon-plus-sign"); 
}); 

jQuery(function($){ 
    //open the lateral panel 
    $('.cd-btn').on('click', function(event){ 
     event.preventDefault(); 
     $('.cd-panel').toggleClass('is-visible'); 
    // CHECKING ICON OF .cd-btn-a 
    if($('.cd-btn-a').hasClass('glyphicon-minus-sign')) { 
     $('.cd-btn-a').toggleClass('glyphicon-minus-sign glyphicon-plus-sign'); 
     $('.cd-panel-a').removeClass('is-visible'); 
    } 
    }); 
    //close the lateral panel 
    $('.cd-panel').on('click', function(event){ 
     if($(event.target).is('.cd-panel') || $(event.target).is('.cd-panel-close')) { 
      $('.cd-panel').removeClass('is-visible'); 
      $('.cd-btn').toggleClass("glyphicon-minus-sign glyphicon-plus-sign"); 
      event.preventDefault(); 
     } 
    }); 
}); 

$(function() { 
    var icons = { 
     header: "ui-icon-caret-1-s", 
     activeHeader: "ui-icon-caret-1-n" 
    }; 
    $("#accordion").accordion({ 
     icons: icons 
    }); 
    $("#toggle").button().on("click", function() { 
     if ($("#accordion").accordion("option", "icons")) { 
     $("#accordion").accordion("option", "icons", null); 
     } else { 
     $("#accordion").accordion("option", "icons", icons); 
     } 
    }); 
    }); 
    $("#accordion").accordion({ header: "h3", collapsible: true, active: false, heightStyle: "content"}); 

Answer 1

您需要使用

$("#accordion").accordion('option', {active: false}); 

Jsfiddle