Html 单击时,Accordion表仅显示一行(引导)
我制作了一个表/手风琴的东西,它有隐藏的行,只有当你点击“标题”行时才可见。不幸的是,对于您单击的每个标题,该表只显示一行 正如您在代码中看到的,每个标题行(例如:“9/Parts Inspection”)都有两个子行是隐藏的(例如:“9.1”和“9.2”)。单击时,只有第一个(9.1)显示,其他(9.2和我添加的任何其他)在显示时隐藏 我假设类名/id名混淆是一个问题,但无论我给出什么不同的名称,它仍然不起作用Html 单击时,Accordion表仅显示一行(引导),html,twitter-bootstrap,jquery-ui,html-table,accordion,Html,Twitter Bootstrap,Jquery Ui,Html Table,Accordion,我制作了一个表/手风琴的东西,它有隐藏的行,只有当你点击“标题”行时才可见。不幸的是,对于您单击的每个标题,该表只显示一行 正如您在代码中看到的,每个标题行(例如:“9/Parts Inspection”)都有两个子行是隐藏的(例如:“9.1”和“9.2”)。单击时,只有第一个(9.1)显示,其他(9.2和我添加的任何其他)在显示时隐藏 我假设类名/id名混淆是一个问题,但无论我给出什么不同的名称,它仍然不起作用 <table id="tbl-sample-values" class="
<table id="tbl-sample-values" class="table table-condensed table-bordered table-hover" style="font-size:85%;">
<thead>
<tr class="tabletop">
<th>Step #</th>
<th>Processing Step</th>
<th>Barcode</th>
</tr>
</thead>
<tbody>
<tr data-toggle="collapse" data-target="#accordion" class="clickable row-header">
<td>9</td>
<td colspan="2">Parts Inspection</td>
</tr>
<tr id="accordion" class="collapse">
<td>9.1</td>
<td>Handle silicon electrodes...</td>
<td>[Barcode here]</td>
</tr>
<tr id="accordion" class="collapse">
<td>9.2</td>
<td>Verify part number...</td>
<td>[Barcode here]</td>
</tr>
<tr data-toggle="collapse" data-target="#accordion2" class="clickable row-header">
<td>10</td>
<td colspan="2">IPA Clean</td>
</tr>
<tr id="accordion2" class="collapse">
<td>10.1</td>
<td>Place part with frontside facing up...</td>
<td>[Barcode here]</td>
</tr>
<tr id="accordion2" class="collapse">
<td>10.2</td>
<td>Wipe the part using cleanroom wiper...</td>
<td>[Barcode here]</td>
</tr>
</tbody>
</table>
台阶#
处理步骤
条形码
9
零件检验
9.1
处理硅电极。。。
[此处为条形码]
9.2
验证零件号。。。
[此处为条形码]
10
IPA清洁
10.1
将零件正面朝上放置。。。
[此处为条形码]
10.2
使用洁净室雨刷器擦拭零件。。。
[此处为条形码]
为tr指定相同的类,而不是唯一的id。将此类用作数据目标。例如:
<tr data-toggle="collapse" data-target=".my-row" class="clickable row-header">
<td>9</td>
<td colspan="2">Parts Inspection</td>
</tr>
<tr id="accordion" class="my-row collapse">
<td>9.1</td>
<td>Handle silicon electrodes...</td>
<td>[Barcode here]</td>
</tr>
<tr id="accordion" class="my-row collapse">
<td>9.2</td>
<td>Verify part number...</td>
<td>[Barcode here]</td>
</tr>
9
零件检验
9.1
处理硅电极。。。
[此处为条形码]
9.2
验证零件号。。。
[此处为条形码]
我希望这有帮助。确实有帮助,谢谢!不幸的是,它只能在小提琴上工作(我在那里测试过)。在我的常规项目中,修复不起作用,我不知道为什么。还有什么其他想法可以解释为什么会出问题吗?我有完全相同的代码在我的项目,因为它是在小提琴+你的修复。。。