[英]Bootstrap tab ajax load content when page loaded
i need help about loading tab content when page is loaded. 我需要有关加载页面时加载选项卡内容的帮助。 My example work good but default tab load content only when i click on him.
我的示例工作正常,但仅当我单击他时,默认选项卡加载内容。 That content is not loaded automatically when page is loaded is empty.
当页面加载为空时,该内容不会自动加载。
Check: Fiddle example 检查: 小提琴示例
Like on example u will see you 像例子一样,你会看到你
<ul class="nav nav-tabs tabs-up" id="friends">
<li><a href="/gh/gist/response.html/3843293/" data-target="#contacts" class="media_node active span" id="contacts_tab" data-toggle="tabajax" rel="tooltip"> Contacts </a></li>
<li><a href="/gh/gist/response.html/3843301/" data-target="#friends_list" class="media_node span" id="friends_list_tab" data-toggle="tabajax" rel="tooltip"> Friends list</a></li>
<li><a href="/gh/gist/response.html/3843306/" data-target="#awaiting_request" class="media_node span" id="awaiting_request_tab" data-toggle="tabajax" rel="tooltip">Awaiting request</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="contacts">
</div>
<div class="tab-pane" id="friends_list">
</div>
<div class="tab-pane urlbox span8" id="awaiting_request">
</div>
</div>
And js: 和js:
$('[data-toggle="tabajax"]').click(function(e) {
var $this = $(this),
loadurl = $this.attr('href'),
targ = $this.attr('data-target');
$.get(loadurl, function(data) {
$(targ).html(data);
});
$this.tab('show');
return false;
});
Place this at the very end of your script: 将其放在脚本的最后:
$(document).ready(function(){
$('[data-toggle="tabajax"]:first').click();
});
that's it worked here is the complete js code: 就是这样,这里是完整的js代码:
<script type="text/javascript">
$('[data-toggle="tab"]').click(function(e) {
var $this = $(this),
loadurl = $this.attr('href'),
targ = $this.attr('data-target');
$.get(loadurl, function(data) {
$(targ).html(data);
});
$('[data-toggle="tab"]:eq(0)').trigger('click');
$this.tab('show');
return false;
});
$(document).ready(function(){
$('[data-toggle="tab"]:first').click();
});
</script>
Thanks a lot 非常感谢
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.