Javascript 使用可折叠文件时Boostrap和JQuery的右调用顺序

我遇到了最奇怪的问题，无法解决。我在bootstrap中使用了一系列可折叠按钮，如果在jquery之前调用bootstrap，一切看起来都很好：

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.4.min.js"></script>

但是，如果我在boostrap之前调用jquery（应该这样做），那么可折叠文件在打开后不会关闭。我不确定我是在调用彼此不兼容的库，还是有另一个我不知道的问题？完整的

标记为：

<link href="https://cdnjs.cloudflare.com/ajax/libs/dragula/3.7.1/dragula.min.css" rel="stylesheet" />   
<link href="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.css" rel="stylesheet" />
<link href="https://cdn.bootcss.com/dragula/3.7.1/dragula.css" rel="stylesheet" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" />

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/c3/0.4.10/c3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dragula/3.7.1/dragula.min.js"></script>

和一个可折叠的样品：

<div class="container" id="maincontainer">
    <div class="panel-group">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h4 class="panel-title">
                    <a data-toggle="collapse" href="#collapse1"><center><b>My Panel</b></center></a>
                </h4>
            </div>
            <div id="collapse1" class="panel-collapse collapse">
               <ul class="list-group">                   
                  ### contents
               </ul
            </div>
        </div>
     </div>
  </div>

###内容
我猜你正在为你的网站使用一个模板

因此，您的可折叠文件可能正在结合使用引导与jQuery的
$（document）.ready
，因此需要在jQuery代码之前加载引导，否则将丢失DOM的部分

在引导之前调用jQuery的问题是，jQuery代码包含大量的
$（document）.ready（function（）{code}）块，这意味着需要加载DOM（页面的整个结构）才能执行代码

因此，如果在引导之前调用jQuery，它将遍历所有jQuery代码，并在许多代码块上给出false，因为在jQuery代码已经执行之后，DOM的很大一部分（引导集成部分）被加载

因此，我的猜测（因为我看不到您的全部代码）是您的代码很好，只需按正确的顺序调用脚本即可。
您可以发布可折叠按钮的jQuery和html代码吗？我更改了我的
$（文档）。ready
功能位于脚本列表的底部，现在工作起来很有魅力。。。