顯示Bootstrap選項卡事件僅第一次觸發，而不是第二次或更高版本選項卡開關

我正在使用Bootstrap 3.3.5版，並使用兩個選項卡在兩個內容窗格之間切換。我設置了一個監聽程序，用於切換到「註釋」窗格的選項卡。它第一次發射。但是如果我在另一次（或多次）之間來回切換標籤，事件不會再次發生。顯示Bootstrap選項卡事件僅第一次觸發，而不是第二次或更高版本選項卡開關

$('#commentsTab').on('shown.bs.tab', function (e) { 
    console.log("do stuff here"); 
});

和這裏的HTML標籤：

<ul class="nav nav-pills side-tabs" role="tablist"> 
    <li class="side-tab hidden-md hidden-lg" ng-class="oneColumn ? 'active' : ''" role="presentation"> 
     <a href="" data-target="#topcard" data-toggle="tab" role="tab">{{title}}</a> 
    </li> 
    <li class="side-tab" ng-class="oneColumn ? '' : 'active'" role="presentation"> 
     <a href="" data-target="#notes" data-toggle="tab" role="tab"><i class="fa fa-clone"></i>Notes</a> 
    </li> 
    <li role="presentation" class="side-tab"> 
     <a id="commentsTab" class="comments-tab" href="" data-target="#comments" data-toggle="tab" role="tab"><i class="fa fa-comment-o"></i>Feedback</a> 
    </li> 
</ul>

任何人知道如何使這項工作，讓我每天可靠的選項卡切換到時間把事件？

來源

2016-02-13 Rebecca

你有沒有在''選項卡上給出正確的'href'值？你也可以請分享標籤面板的HTML標記。 –

@NikhilNanjappa - 我正在使用選項卡的數據目標來找到正確的面板而不是href（以防止角度將其作爲路由更改） - 我已經添加了上面的html代碼。這是行得通的 - 標籤可靠地切換面板來回。這是在元素上觸發的事件，它們在第一次後不工作。它總是在第一個標籤開關上觸發（並且只在第一個標籤上），所以我知道我已經註冊了正確的事件/正確的元素......任何其他想法？謝謝！ – Rebecca

這似乎是爲我工作麗貝卡。無論我在標籤頁之間切換多少次，該活動始終都在發射，並且我收到了消息。 –

多一點調查後，我想通了這個問題 - 發佈的情況下，它可以幫助任何人......

我也註冊了相同的選項卡中顯示事件接頭元件上的角度指令。我忘記了它在第一次之後未註冊（取消綁定（））事件。

顯然，這條線是從所有已註冊的函數中解除顯示事件的綁定，而不僅僅是它本身。

elem.unbind('shown');

所以不是我重組它使用命名功能，（在此answer等）拆散只是功能：

 var unbind = function (elem) { 
      elem.unbind('shown', scope.scrollFn); 
     }; 

     scope.scrollFn = function (elem) { 
      //do stuff here 
      unbind(elem); 
     }; 

     elem.on('shown.bs.tab', scope.scrollFn);

現在解除綁定並不影響我對顯示註冊的其他功能事件在原來的職位。

來源

2016-02-20 06:10:37 Rebecca

顯示Bootstrap選項卡事件僅第一次觸發，而不是第二次或更高版本選項卡開關

回答

相關問題