使用其他脚本源文件的树结构对我正在使用的层次结构非常有效。
但是当我在按钮的“可扩展可折叠内容”中使用相同的树结构内容时，问题就出现了：如果我使用树形结构的java脚本代码然后展开按钮的折叠功能不起作用但扩展折叠功能树正在工作。当我不使用树形结构的java脚本代码然后展开按钮的折叠功能工作时，不用说树的展开折叠功能不起作用。
我附加了按钮代码及其java脚本代码.....
// button JS code ......
<script>
(function(){
('#demo').on('hide.bs.collapse', function () {
('button1').html('<span class="glyphicon glyphicon-collapse-down"></span> Show');
})
('#demo').on('show.bs.collapse', function () {
('button1').html('<span class="glyphicon glyphicon-collapse-up"></span> Hide');
})
})
(function(){
('#demo').on('hide.bs.collapse', function () {
('button2').html('<span class="glyphicon glyphicon-collapse-down"></span> Show');
})
('#demo').on('show.bs.collapse', function () {
('button2').html('<span class="glyphicon glyphicon-collapse-up"></span> Hide');
})
})
</script>
// tree structure JS code ......
<script src="HTML5 Admin_files/jquery.min.js">
</script>
<script src="HTML5 Admin_files/bootstrap.min.js">
</script>
<script src="HTML5 Admin_files/jquery-ui.js" type="text/javascript">
</script>
<script src="HTML5 Admin_files/jstree.min.js">
</script>
<script src="HTML5 Admin_files/stackers.js">
</script><div class="box-footer">
<button id="button1" type="button" class="btn btn-primary"
data-toggle="collapse" data-target="#demo1">
<span class="glyphicon glyphicon-collapse-down"></span> Show 1
</button>
<div id="demo1" class="collapse">
<div class="tree">
<ul>
<li class="parent_li">
<span class="badge green" title="Collapse this branch">
<i class="fa fa-folder-open">
</i> Parent
</span>
<a href="">Anyhing can go here!
</a>
<ul>
<li class="parent_li">
<span class="badge red" title="Collapse this branch">
<i class="fa fa-minus-sign">
</i> Child
</span>
<a href="">Anyhing can go here!
</a>
<ul>
<li style="display: list-item;">
<span class="badge orange" title="Collapse this branch">
<i class="fa fa-leaf">
</i> Akhil
</span>
<a href="">Anyhing can go here!
</a>
<ul>
<li class="parent_li" style="display: list-item;">
<span class="badge red" title="Collapse this branch">
<i class="fa fa-minus-sign">
</i> Great Grand Child
</span>
<a href="">Anyhing can go here!
</a>
<ul>
<li style="display: list-item;">
<span class="badge green" title="Collapse this branch">
<i class="fa fa-leaf">
</i> Great great Grand Child
</span>
<a href="">Anyhing can go here!
</a>
</li>
<li style="display: list-item;">
<span class="badge green" title="Collapse this branch">
<i class="fa fa-leaf">
</i> Great great Grand Child
</span>
<a href="">Anyhing can go here!
</a>
</li>
</ul>
</li>
<li style="display: list-item;">
<span class="badge red" title="Collapse this branch">
<i class="fa fa-leaf">
</i> Great Grand Child
</span>
<a href="">Anyhing can go here!
</a>
</li>
<li style="display: list-item;">
<span class="badge red" title="Collapse this branch">
<i class="fa fa-leaf">
</i> Great Grand Child
</span>
<a href="">Anyhing can go here!
</a>
</li>
</ul>
</li>
<li style="display: list-item;">
<span class="badge orange" title="Collapse this branch">
<i class="fa fa-leaf">
</i> Grand Child
</span>
<a href="">Anyhing can go here!
</a>
</li>
</ul>
</li>
<li class="parent_li">
<span class="badge red" title="Collapse this branch">
<i class="fa fa-minus-sign">
</i> Child
</span>
<a href="">Anyhing can go here!
</a>
<ul>
<li>
<span class="badge orange" title="Collapse this branch">
<i class="fa fa-leaf">
</i> Grand Child
</span>
<a href="">Anyhing can go here!
</a>
</li>
<li class="parent_li">
<span class="badge orange" title="Collapse this branch">
<i class="fa fa-minus-sign">
</i> Grand Child
</span>
<a href="">Anyhing can go here!
</a>
<ul>
<li class="parent_li" style="display: list-item;">
<span class="badge green" title="Collapse this branch">
<i class="fa fa-minus-sign">
</i> Great Grand Child
</span>
<a href="">Anyhing can go here!
</a>
<ul>
<li style="display: list-item;">
<span class="badge orange" title="Collapse this branch">
<i class="fa fa-leaf">
</i> Great great Grand Child
</span>
<a href="">Anyhing can go here!
</a>
</li>
<li style="display: list-item;">
<span class="badge orange" title="Collapse this branch">
<i class="fa fa-leaf">
</i> Great great Grand Child
</span>
<a href="">Anyhing can go here!
</a>
</li>
</ul>
</li>
<li style="display: list-item;">
<span class="badge green" title="Collapse this branch">
<i class="fa fa-leaf">
</i> Great Grand Child
</span>
<a href="">Anyhing can go here!
</a>
</li>
<li style="display: list-item;">
<span class="badge green" title="Collapse this branch">
<i class="fa fa-leaf">
</i> Great Grand Child
</span>
<a href="">Anyhing can go here!
</a>
</li>
</ul>
</li>
<li>
<span class="badge orange" title="Collapse this branch">
<i class="fa fa-leaf">
</i> Grand Child
</span>
<a href="">Anyhing can go here!
</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
</div>
</br>
</br>
<button id="button2" type="button" class="btn btn-primary"
data-toggle="collapse" data-target="#demo">
<span class="glyphicon glyphicon-collapse-down"></span> Show 2
</button>
<div id="demo" class="collapse">
<ol class="list-group">
<li class="list-group-item">Wa</li>
<li class="list-group-item">Adurer</li>
<li class="list-group-item">Mae</li>
</ol>
</div>