Bootstrap打开/折叠不起作用

Question

我正在尝试打开div中的div。

我的第二个div没有打开，事实上，第一个div正在关闭。

尝试单击第1部分，然后单击其下的div。

我希望div在点击时打开，但它正在关闭part1 div

＆＃13;

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<center><strong>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<div class="panel-group" id="accordion">
	<div class="panel panel-default"  data-toggle="collapse" data-parent="#accordion" href="#part1"> <!--Date of Birth-->
      <div class="panel-heading">
        <h4 class="panel-title">
          Part 1
        </h4>
      </div>
      <div id="part1" class="panel-collapse collapse">
        <div class="panel-body">
		
		<div class="panel-group" id="accordion1.1">
	<div class="panel panel-default"  data-toggle="collapse" data-parent="#accordion1.1" href="#1.1"> <!--Date of Birth-->
      <div class="panel-heading">
        <h4 class="panel-title">
          ऑडियो नंबर 15 छह काय के जीव
        </h4>
      </div>
      <div id="1.1" class="panel-collapse collapse">
        <div class="panel-body">
		<audio controls="controls">
    <source src="https://docs.google.com/uc?export=download&id=1HMEmwK4COifRjhe8IWM82Pn5tw3UO4xs">	
</audio>
		</div>
      </div>
    </div>
    </div>
		
		</div>
      </div>
    </div>
    </div>
</strong></center>

＆＃13;

＆＃13;

＆＃13;

Answer 1

将part1 div及其子项移到accordion div之外。我将您的1.1 div重命名为one，因为ID不应以数字开头。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<center>
<strong>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <div class="panel-group" id="accordion">
        <div class="panel panel-default" data-toggle="collapse" data-parent="#accordion" href="#part1">
            <!--Date of Birth-->
            <div class="panel-heading">
                <h4 class="panel-title">
                    Part 1
                </h4>
            </div>
        </div>
    </div>
    <div id="part1" class="panel-collapse collapse">
        <div class="panel-body">

            <div class="panel-group" id="accordion1.1">
                <div class="panel panel-default" data-toggle="collapse" data-parent="#accordion1.1" href="#one">
                    <!--Date of Birth-->
                    <div class="panel-heading">
                        <h4 class="panel-title">
                            ऑडियो नंबर 15 छह काय के जीव
                        </h4>
                    </div>
                    <div id="one" class="panel-collapse collapse">
                        <div class="panel-body">
                            <audio controls="controls">
                                <source src="https://docs.google.com/uc?export=download&id=1HMEmwK4COifRjhe8IWM82Pn5tw3UO4xs">
                            </audio>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</strong>
</center>