[英]How do to load Bootstrap dynamic tabs content only when it is active?
[英]How do I load Bootstrap tab content only when it is active?
我正在使用Bootstrap选项卡从服务器加载窗口小部件。 我需要的是在用户单击选项卡后立即加载选项卡内容,而不是页面的初始加载。 例如以下是该页面的HTML:-
<ul class="nav nav-tabs" role="tablist">
<li class="active"><a href="#tabs-first" role="tab" data-toggle="tab">FX</a></li>
<li><a href="#tabs-second" role="tab" data-toggle="tab">US Bond Futures</a></li>
<li><a href="#tabs-third" role="tab" data-toggle="tab">US Short Term IR futures</a></li>
<li><a href="#tabs-fourth" role="tab" data-toggle="tab">Global Equity Indices</a></li>
<li><a href="#tabs-fifth" role="tab" data-toggle="tab">Commodities</a></li>
<li><a href="#tabs-sixth" role="tab" data-toggle="tab">Volatility</a></li>
</ul>
<!-- Tab Content -->
<div class="tab-content">
<!-- FX TAB content -->
<div class="active tab-pane fade in" id="tabs-first">
</div>
</div>
第一个标签引用了#tabs-first
ID,第二个标签引用了#tabs-second
。 我想仅在用户单击该选项卡时才加载#tabs-second
,而不是在页面的初始加载时加载。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.