檢測活動標籤是否已更改jquery

我有這個標籤。有沒有辦法檢測活動標籤頁被更改的時間？檢測活動標籤是否已更改jquery

<div class="navbar"> 
    <div class="navbar-inner"> 
     <ul class="nav nav-tabs" style="display:inline-flex"> 
      <li class="active"><a href="#step1" data-toggle="tab" id="step1">Step 1</a></li> 
      <li><a href="#step2" data-toggle="tab" id="step2">Step 2</a></li> 
      <li><a href="#step3" data-toggle="tab" id="step3">Step 3</a></li> 
      <li><a href="#step4" data-toggle="tab" id="step4">Step 4</a></li> 
      <li><a href="#step5" data-toggle="tab" id="step5">Step 5</a></li> 
      <li><a href="#step6" data-toggle="tab" id="step6">Step 6</a></li> 
      <li><a href="#step7" data-toggle="tab" id="step7">Step 7</a></li> 
     </ul> 
     </div> 
    </div>

我想那是什麼東西前者活躍，還可以得到什麼新的活動標籤的標籤的ID。這可能嗎？

來源

2017-03-10 AyakoS

這裏是如何做到這一點與引導：

$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) { 

    e.relatedTarget // previous active tab 
    e.target // newly activated tab 

    console.log("id of previous active tab: " + e.relatedTarget.id); 
    console.log("id of newly activated tab: " + e.target.id); 

});

完整的文檔在這裏：http://getbootstrap.com/javascript/#tabs-events

來源

2017-03-10 01:22:58

我覺得這是你在尋找！

注意我忘了添加功能來檢測以前的選項卡。因此，這裏是與以前的標籤檢測

jQuery(function($) { 
 
    $("#tabs").tabs({ 
 
    activate: function(event, ui) { 
 
     var active = $('#tabs').tabs('option', 'active'); 
 
     $("#tabid").html('the tab id is ' + $("#tabs ul>li a").eq(active).attr("href")); 
 
    }, 
 
    beforeActivate: function(event, ui) { 
 

 
     var active = $('#tabs').tabs('option', 'active'); 
 
     $("#prevtabid").html('the prev tab id is ' + $("#tabs ul>li a").eq(active).attr("href")); 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> 
 
<link rel="stylesheet" type="text/css" media="all" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/themes/base/jquery-ui.css"> 
 

 

 
<div id="tabs"> 
 
    <ul> 
 
    <li><a href="#step1">Step 1</a></li> 
 
    <li><a href="#step2">Step 2</a></li> 
 
    <li><a href="#step3">Step 3</a></li> 
 
    <li><a href="#step4">Step 4</a></li> 
 
    <li><a href="#step5">Step 5</a></li> 
 
    <li><a href="#step6">Step 6</a></li> 
 
    <li><a href="#step7">Step 7</a></li> 
 
    </ul> 
 
    <div id="step1"> 
 
    <p>Content for Step 1</p> 
 
    </div> 
 
    <div id="step2"> 
 
    <p>Content for Step 2</p> 
 
    </div> 
 
    <div id="step3"> 
 
    <p>Content for Step 3</p> 
 
    </div> 
 
    <div id="step4"> 
 
    <p>Content for Step 4</p> 
 
    </div> 
 
    <div id="step5"> 
 
    <p>Content for Step 5</p> 
 
    </div> 
 
    <div id="step6"> 
 
    <p>Content for Step 6</p> 
 
    </div> 
 
    <div id="step7"> 
 
    <p>Content for Step 7</p> 
 
    </div> 
 
</div> 
 
<div id="prevtabid"></div> 
 
<div id="tabid"></div>

來源

2017-03-10 01:45:59 Teocci

您可以處理 'shown.bs.tab' 事件，並獲得ID喜歡這個版本..

$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) { 
    var currId = $(e.target).attr("id"); 
})

演示：http://www.codeply.com/go/isRcJZloBm

來源

2017-03-10 02:24:12 ZimSystem

檢測活動標籤是否已更改jquery

回答

相關問題