我正在尝试制作一个多层次的手风琴,其中的表可以有多个层次。 this is my requirement
我仍然是菜鸟,所以我在代码笔上尝试了其他一些东西,这些东西有无限的嵌套,但CDN或某些东西似乎破坏了我的布局,但我终于找到了 一个有效,现在我的布局看起来像this(base level) (expanded),但是表格坏了。 我当前的代码是一团糟,所以id喜欢知道是否有一种干净的方法来执行此操作,当前的完整代码为: https://pastebin.com/PBTDhxyY
手风琴代码(基本级别):
<div class="row product-listing">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="panel panel-default">
<div class="panel-body nested-accordion">
<div class="row mt-10">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="panel-group" id="level1-accordion">
<div class="panel panel-default">
<div class="panel-heading">
<a data-toggle="collapse" data-parent="#level1-accordion" href="#plast-pro-1" class="collapsed">
<table class="table">
<tr>
<td>LEVEL 1</td>
<?php
for ($k = 0 ; $k < 11; $k++){
echo '<td> </td>';
}
?>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
</tr>
</table>
</a>
</div>
<div id="plast-pro-1" class="panel-collapse collapse">
<div class="panel-body">
<ul class="list-unstyled">
<li>
<div class="panel-group" id="level2-accordion" role="tablist" aria-multiselectable="true">
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingOne">
<h4 class="panel-title">
<a class="collapsed" role="button" data-toggle="collapse" data-parent="#level2-accordion" href="#plast-pro-2" aria-expanded="true" aria-controls="plast-pro-2">
<table class="table">
<tr>
<td>LEVEL 2</td>
<?php
for ($k = 0 ; $k < 11; $k++){
echo '<td> </td>';
}
?>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
</tr>
</table>
</a>
</h4>
</div>
</div>
</div>
</li>
<li>
<div class="panel-group" id="level2test" role="tablist" aria-multiselectable="true">
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingOne">
<h4 class="panel-title">
<a class="collapsed" role="button" data-toggle="collapse" data-parent="#level2test" href="#level2testlink" aria-expanded="true" aria-controls="plast-pro-2">
<table class="table">
<tr>
<td>LEVEL 2</td>
<?php
for ($k = 0 ; $k < 11; $k++){
echo '<td> </td>';
}
?>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
</tr>
</table>
</a>
</h4>
</div>
</div>
</div>
</li>
<!-- ------------------------------------------------------------------------------------------------------------------------------------------------- -->
<li>
<div class="panel-group" id="level2testb" role="tablist" aria-multiselectable="true">
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingOne">
<h4 class="panel-title">
<a class="collapsed" role="button" data-toggle="collapse" data-parent="#level2testb" href="#level2testlinkb" aria-expanded="true" aria-controls="plast-pro-2">
<table class="table">
<tr>
<td>LEVEL 2</td>
<?php
for ($k = 0 ; $k < 11; $k++){
echo '<td> </td>';
}
?>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
<td>0.00</td>
</tr>
</table>
</a>
</h4>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>