bootstrap選項卡動態內容

Question

我正在過渡到jquery 1.9並使用.on，過去我對.live（）的依賴太多了，當然生活很棒，現在事情再次顯得非常複雜。

我試圖加載動態內容到一些引導標籤。但與.on我不知道如何顯示#ticketnotes時觸發ajax調用。

HTML是如下：

<div class="tabbable ticket_tabs"> 
    <ul class="nav nav-tabs" id="tickettabs"> 
     <li class="active"> 
      <a href="#ticketreplies" data-toggle="tab">Replies</a> 
     </li> 
     <li > 
      <a class="tabtickets" href="#ticketnotes" data-toggle="tab">Ticket Notes</a> 
     </li> 
     <li> 
      <a href="#timetrackticket" data-toggle="tab">Time Track</a> 
     </li> 
    </ul> 
    <div class="tab-content"> 
     <div class="tab-pane active" id="ticketreplies"> 
      $body 
      $replyForm 
     </div> 
     <div class="tab-pane" id="ticketnotes"> 
      <div class="well"> 
       <div class="loader" style="display:none;"> 
      </div> 
     </div> 
     $replyForm 
    </div> 
    <div class="tab-pane" id="timetrackticket"> 
     <div class="well">time track info</div> 
    </div> 
</div> 

當頁面加載時，「票回覆」已經存在，但看到我多麼想繼續加載時間到最低限度，我而是單獨加載所有相關數據，查看票證並不一定意味着有人要通過筆記，因此不需要立即加載它。

我最後一次嘗試看起來是這樣的：

$('#tickettabs').on('show', '.tabtickets', function(){ 
    if($('#ticketnotes').is(":visible")){ 
     alert("hi"); 
    } 
}); 

不用說，它從來沒有說喜。

運行完全相同，如果在Firefox中的條件工作，因爲它應該。所以我很自信，問題在於我如何綁定事件處理程序。

我感謝你提前爲幫助節省什麼，因爲演出事件被觸發的時間留給我的理智:)

Answer 1

是，瀏覽器可能不會有時間重繪DOM。

一個可能的解決方案是使用延時功能，延時爲0。

$('#tickettabs').on('show', '.tabtickets', function(e){ 
    setTimeout(function(){ 
    if($('#ticketnotes').is(":visible")){ 
     alert("hi"); 
    } 
    }, 0) 
}); 

演示：Plunker

另一種解決方案是檢查其標籤頭被點擊

$('#tickettabs').on('show', '.tabtickets', function(e){ 
    if($(this).has('a.tabtickets')){ 
    alert('has tabtickets') 
    } 
});