Question

当第二个标题打开时，其下有2个子标题。当我试图打开这两个子中的任何一个时，它们会打开并迅速关闭主手风琴。

我做错了什么？欢呼声。

$( "#accordion" ).accordion({
heightStyle: "content",
collapsible: true,
active: 'none',
});

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<!--Accordian-->
<div id="accordion" style="margin-top:20px;">
<!--Title--> 
	<h3 style="border-top:solid 1px #71a232; border-bottom:solid 1px #71a232"><p class="dropdownTitleText" style="color:#f7941d;">Agri Business Division</p></h3>
<!--Title-->
<!--Content-->        
     	<div class="accordion-content">
                TEXT TEXT TEXT
    	</div>
<!--Content--> 
<!--Title--> 
	<h3 style="border-top:solid 1px #71a232; border-bottom:solid 1px #71a232"><p class="dropdownTitleText" style="color:#4f9bd1;">Consumer Business Division</p></h3>
<!--Title-->
<!--Content--> 
<div>
<div id="accordion">
	<h3 style="border-top:solid 1px #71a232; border-bottom:solid 1px #71a232"><p class="dropdownTitleText" style="color:#4f9bd1;">SUB1</p></h3>       
     	<div class="accordion-content">
			SUB1 TEXT
    	</div>
        
	<h3 style="border-top:solid 1px #71a232; border-bottom:solid 1px #71a232"><p class="dropdownTitleText" style="color:#4f9bd1;">SUB2</p></h3>       
     	<div class="accordion-content">
			SUB2 TEXT
    	</div>
</div>
</div>
<!--Content--> 
</div>
<!--Accordian-->

Answer 1

更新了你的小提琴。问题是你有两个具有相同ID的元素，因此将“id”更改为“class”将解决问题：

<div class="accordion" style="margin-top:20px;"><!--First element-->
<div class="accordion"><!--Second element--></div>

$(".accordion").accordion({
    heightStyle: "content",
    collapsible: true,
    active: 'none',
});

嵌套手风琴立即打开和关闭

1 个答案: