如何获得当前显示的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

回答

相关问题