[英]Dynamically load content in Bootstrap nav-tabs
This is my HTML: 这是我的HTML:
<div id="tabpanes" style="display: none;">
<ul class="nav nav-tabs" role="tablist">
<li class="nav-item">
<a class="nav-link active" href="#profile" role="tab" data-toggle="tab">Klantgegevens</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#buzz" role="tab" data-toggle="tab">Documenten</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#references" role="tab" data-toggle="tab">...</a>
</li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<div role="tabpanel" class="tab-pane fade in active" id="profile">
</div>
<div role="tabpanel" class="tab-pane fade" id="buzz">...</div>
<div role="tabpanel" class="tab-pane fade" id="references">...</div>
</div>
</div>
This is my jquery code: 这是我的jQuery代码:
function klantdetails(id = null) {
if(id){
$("#tabpanes").show();
$("#profile").load("php/getklantinfo.php", "id=id");
}
}
When the function is called, nothing seems te happen. 调用该函数时,似乎什么也没有发生。 However, if I click another nav link, and then return to the first one, the content is loaded in the #profile tab pane.
但是,如果单击另一个导航链接,然后返回到第一个导航链接,则该内容将加载在#profile选项卡窗格中。 What's the reason it's not visible immediately?
为什么它不立即可见是什么原因?
通过从第一个选项卡面板中删除淡入淡出类来解决。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.