[英]Content appears below the div of the current tab when switched to new tab
我正在使用Bootstrap动态可切换标签。 我有两个选项卡,第一个选项卡(活动选项卡)的内容在页面加载时动态绑定,当我切换到第二个选项卡时,内容再次动态绑定onclick 。 不同选项卡的元素一个出现在另一个之下。 如何防止div出现在另一个下方?
<div id="content">
<table>
<tr>
<td >
<div id="graphArea" class="startSize">
<div>
</div>
</td>
<td id="searchArea">
<ul class="nav nav-tabs" id="resultList">
<li class="active"><a data-toggle="tab" href="#resultsArea">Results</a></li>
<li ><a data-toggle="tab" href="#facetsArea">Facets</a></li>
</ul>
<div class="tab-content">
<div class="searchsize" class="tab-pane fade in active" id="resultsArea">
<table>
<tr>
<td>
<p><b>Search Results for :</b> <p style="color:green"><b id="searchText"></b></b></p></p>
</td>
</tr>
<tr>
<td>
<div class="list-group">
<div>
<table class="table-hover" id="resultTab" style="word-break: break-all;">
<tbody id="searchResults">
//data is dynamically bound to tbody
</tbody>
</table>
</div>
<div id="pager">
<ul id="pagination" class="pagination-sm"></ul>
</div>
</div>
</td>
</tr>
</table>
</div>
<div id="facetsArea" class="tab-pane fade">
<p>Helllo</p>
</div>
</div>
</td>
</tr>
</table>
</div>
从div
删除重复的类属性class="searchsize"
,并使其作为class="tab-pane fade in active searchsize"
。 有用。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.