如何獲得當前顯示的Tab鍵索引使用jQuery 1.7.2

我深化發展網頁HTML全光照+ PHP + jQuery和我面臨着以下問題。該頁面使用jquery-1-7-2.js（由於某些歷史原因我無法升級...）。我使用PHP，形成查詢MySQL數據庫，然後（使用jquery）diplay結果在不同的標籤。如何獲得當前顯示的Tab鍵索引使用jQuery 1.7.2

的問題是，我希望能夠刷新頁面（表格provocates上的變化自動刷新）時保持當前的活動選項卡上。

有我使用的代碼類型：

<html> 

<div class="container"> 
    <div class="row"> 

    <div class="span12"> 

     <div class="well"> 
     <div class="row"> 

      <div class="span2"> 
      <form name="choice"> 
      <label>Choice :</label> 
      <select name="menu" style="width:150px" onChange="refreshFormTechno(this.options[this.selectedIndex].value);"> 
      <option value="%">ALL</option> 
      <option value="choice1">Choice 1</option> 
      <option value="choice2">Choice 2</option> 
      </select> 
      </form> 
      </div> 

     </div> 
     </div> 

    <ul class="nav nav-tabs" id="MyTab"> 
    <li class="active"><a href="#tab1" data-toggle="tab">First Tab</a></li> 
    <li><a href="#tab2" data-toggle="tab">Second Tab</a></li> 
    <li><a href="#tab3" data-toggle="tab">Third Tab</a></li> 
    </ul> 


     <div class="tab-content"> 

     <div class="tab-pane active" id="tab1"> 
      <div class="row"> 
     MY CODE TO DISPLAY IN TAB 1 
     </div> 
     </div> 


     <div class="tab-pane" id="tab2"> 
      <div class="row"> 
     MY CODE TO DISPLAY IN TAB 2 
     </div> 
     </div> 

     <div class="tab-pane" id="tab3"> 
      <div class="row"> 
     MY CODE TO DISPLAY IN TAB 3 
     </div> 
     </div> 

     </div> 

    </div> 
    </div> 
</div> 

<script type="text/javascript" language="javaScript"> 
function refreshFormTechno(value_id) 
{ 
    document.location = './index.php?choice='+value_id; 
} 
</script> 


</html>

如果我通過改變腳本的一部分：

<script type="text/javascript" language="javaScript"> 
function refreshFormTechno(value_id) 
{ 
    //document.location = './index.php?choice='+value_id; 
    var index = $('#MyTab a[href="#tab2"]').parent().index(); 
    alert(index); 
} 
</script>

我能夠得到我想要的標籤的ID（0對於tab1,1對於tab2）。但我無法弄清楚如何獲取活動標籤的ID。

我發現很多線程有關此類型的問題，並試圖測試給出的代碼，但沒有奏效。我想：

<script type="text/javascript" language="javaScript"> 
function refreshFormTechno(value_id) 
{ 
    //document.location = './index.php?choice='+value_id; 
    var index = $('#MyTab').tabs('option', 'selected'); 
    alert(index); 
} 
</script>

或者：

<script type="text/javascript" language="javaScript"> 
function refreshFormTechno(value_id) 
{ 
    //document.location = './index.php?choice='+value_id; 
    var index = $('#MyTab').parent.tabs('option', 'selected'); 
    alert(index); 
} 
</script>

沒有結果......

知道當前Tab鍵索引將允許我重新加載整個頁面時，更改默認的活動標籤。不僅僅是它允許我只在需要時加載php腳本並限制頁面的充電時間。

非常感謝您的幫助。

來源

2013-04-15 CocoRuby

你是如何隱藏/顯示標籤？我假設你正在使用jquery hide（）＆show（）？ – Nick

我真的不熟悉jQuery和沒有得到時間去學習它，所以我加入了GET參數在我整理的網址，我使用PHP和設置在正確的一個「活動」值設爲默認的活動標籤。它工作，這就是我想要的，也許這不是最好的實踐，但我真的沒有時間。無論如何，非常感謝你的幫助。 – CocoRuby

你就不能使用「主動」窗格中的id？

var visiblePaneId = $('div.tab-pane.active').attr('id') 
var activeTabIndex = $('#MyTab a[href="' + visiblePaneId + '"]').parent().index();

或取得活動標籤：

var tabHref = $('li.active:first-child').attr('href'); //returns the anchor's href which has # 
var activeTabIndex = $(tabHref).parent().index();

來源

2013-04-15 13:09:30 Nick

謝謝，第一種方法的作品！只需在href中添加＃標記var visiblePaneId = $（'div.tab-pane.active'）。attr（'id'）; var activeTabIndex = $（'＃MyTab a [href =「＃'+ visiblePaneId +'」]'）。parent（）。index（）;' – CocoRuby

如何獲得當前顯示的Tab鍵索引使用jQuery 1.7.2

回答

相關問題