0

我根据 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
  });
}
4

1 回答 1

1

我不认为您在这里选择的是文档就绪处理程序....您可以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')
        }
    });
});

演示：小提琴

如果您只想针对特定选项卡，则仅为那些a元素注册处理程序，例如

$('.nav-tabs a[href="#profile"]').one('show', function(e){
    //this will fire for only profile tab
});
于 2013-09-15T13:39:51.567 回答