页面加载时Bootstrap选项卡ajax加载内容

Question

我需要有关加载页面时加载选项卡内容的帮助。我的示例运行良好，但默认选项卡仅在我单击他时加载内容。当页面加载为空时，该内容不会自动加载。

检查： 小提琴示例

就像例子一样，你会看到你

<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>

和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;
});

Answer 1

将其放在脚本的最后：

$(document).ready(function(){
    $('[data-toggle="tabajax"]:first').click();
});