2010-08-06 85 views
7

有沒有辦法重新加載選定的選項卡我知道有.load()函數。但它想要一個標籤索引,我似乎沒有看到一種方法來抓住選定的標籤ID。JQuery UI - 重新加載選定的選項卡?

+0

所以你的問題實在是如何讓所選擇的選項卡的索引? – 2010-08-08 14:36:41

+0

這會解決我的問題,是的。 – Renari 2010-08-08 17:29:38

回答

24

更新:在jQuery 1.9中,selected選項重命名爲active。請參閱attomman's answer.

要獲取當前選定的索引,請使用tabs('option','selected')函數。

例如,如果你有一個按鈕#button(和#tabs元素製作成標籤),你想要得到的指標,做到以下幾點:

$("#button").click(function() { 
    var current_index = $("#tabs").tabs("option","selected"); 
}); 

這裏有一個演示:http://jsfiddle.net/sVgAT/


要回答標題所示,在jQuery的1.8的問題以及更早版本,你會怎麼做:

var current_index = $("#tabs").tabs("option","selected"); 
$("#tabs").tabs('load',current_index); 

而在jQuery的1.9或更高版本,你會怎麼做:

var current_index = $("#tabs").tabs("option","active"); 
$("#tabs").tabs('load',current_index); 
+0

謝謝,那正是我正在尋找的。 – Renari 2010-08-08 19:12:57

+0

此解決方案的問題是,它會重新加載未選定的選項卡兩次(服務器上有兩次點擊)。 – 2012-09-24 21:11:00

+2

不幸的是,截至最新版本的jQuery UI,這不再有效。根據attomman的回答,你必須用''active''替換''選定的''''。 – aroth 2013-04-22 01:30:28

1

我設法得到這個工作,但現在加載第一個選項卡的兩倍,當它處於非活動狀態。如果任何人有任何更多的建議,將不勝感激。 console showing a cancelled request to the server

您可以在上面看到,該請求向服務器發出兩次,但第一個請求成功,因此它取消了第二個請求。不知道這是否是一個問題..??但是我沒有被看到它在控制檯放心

constructor: (@element) -> 
    @tabIndex = 0 
    @tabs = @element.find('#tabs') 
    @tabs.tabs 
     spinner: "Loading.." 
     cache: false 
     ajaxOptions: 
     cache: false 
     error: (xhr, status, index, anchor) -> 
      $(anchor.hash).html "Couldn't load this tab. We'll try to fix this as soon as possible." 

    #add custom load to make sure they always reload even the current tab when clicked 
    @element.find('ul li a').click (e) => 
     if @tabIndex is @tabs.tabs('option', 'selected') 
     @tabs.tabs 'load', @tabs.tabs('option', 'selected') 
     @tabIndex = @tabs.tabs('option', 'selected') 
+0

這應該是一個單獨的問題,所以人們可以正確回答:) – 2012-09-25 12:56:21

2

如果有人絆倒了這個問題,並像我一樣使用jQuery EasyUI的標籤,西門子上面的回答將不起作用。相反,刷新標籤,使用:

var tab = $('#tt').tabs('getSelected'); 
tab.panel('refresh'); 

哪裏tt是通過

<div id="tt" class="easyui-tabs"> 
+0

它確實適用於新版本Easy UI,謝謝 – JacobChan 2013-09-10 08:35:26

0

下載這個插件創建的Cookie中的選項卡組的id

http://plugins.jquery.com/cookie/

插入jQuery cookie到你的頁面

<script src="jquery.cookie.js"></script> 

,並補充一點:

$(".tabs").click(function() { 
    //getter , get the active tab 
    var active = $("#tabs").tabs("option", "active"); 
    $.cookie("tabs_selected", active); 
}); 

var cookieValue = $.cookie("tabs_selected"); 
// setter, set the active tab stocked 
$("#tabs").tabs("option", "active",cookieValue); 
相關問題