jQuery로 부트 스트랩 아코디언 제어하기

Question

현재 부트 스트랩 아코디언 위젯을 구현 중이며 각 패널의 본문에 현재 열려있는 패널을 전환 할 수있는 요소를 배치하고 싶습니다 (다른 패널을 확장하고 다른 패널을 숨김). (패널이 개방의 기본 부트 스트랩 동작에 영향을 미칠 것으로 보인다 어떤 이유

$(".displayPanel").click((e) => { 
    $("[id^='collapse']").collapse('hide'); 
    $("#collapse" + e.target.text).collapse('show'); 
}) 

와 닫는 : 나는 현재 모든 패널을 축소하기 위해 jQuery를 와일드 카드 선택기를 사용하고 내가해야 할 일을 보여줌으로써이 일을 해요 패널이 왼쪽 열리는 등 결국). Here은이 문제를 보여주는 최소 예입니다. 이와 같은 일을 성취하기위한 더 좋은 방법이 있습니까?

미리 감사드립니다.

Answer 1

"숨기기"를 기다렸다가 "쇼"를 실행할 수 있습니다. Here the updated fiddle.

아마도 "숨기기"가 완료되었을 때를 나타내는 이벤트가 있으면 더 깨끗합니다.

$(".displayPanel").click((e) => { 
    $("[id^='collapse']").collapse('hide'); 
    setTimeout(function(){ 
    $("#collapse" + e.target.text).collapse('show'); 
    },1000); 
});