Question

我根据twitter bootstrap标签使用了一些标签：

<ul class="nav nav-tabs">
  <li><a href="#home" data-toggle="tab">Home</a></li>
  <li><a href="#profile" data-toggle="tab">Profile</a></li>
  <li><a href="#messages" data-toggle="tab">Messages</a></li>
  <li><a href="#settings" data-toggle="tab">Settings</a></li>
</ul>

在我的最后一个标签中，有一些函数调用ajax并给我的网站带来负担。也许用户从不打开最后一个标签。我更喜欢我的jquery的现成函数只在该选项卡打开时等待。我知道有一些方法，但有没有任何干净的方法来模拟只有当选择最后一个选项卡时就绪。也许这段代码表达了我想要的东西：

$ run only once on when document ready and last tab opened
{
  $(function() {
     call relatex ajax loadings
  });
}

Answer 1

我不认为你的选择是文档就绪处理程序....你可以使用bootstrap标签为此提供的shown事件

jQuery(function ($) {
    $('.nav-tabs a').one('show', function(e){
        //use e.target to know which tab was shown, then make the ajax requests
        var $target = $(e.target);
        if($target.attr('href') == '#profile'){
            alert('profile')
        } else if($target.attr('href') == '#messages'){
            alert('messages')
        } else if($target.attr('href') == '#settings'){
            alert('settings')
        }
    });
});

演示：Fiddle

如果您只想定位特定标签，请仅为那些a元素注册处理程序，例如

$('.nav-tabs a[href="#profile"]').one('show', function(e){
    //this will fire for only profile tab
});

只有打开选项卡时，jquery函数才会就绪

1 个答案: