記住選定的標籤

我想弄清楚如何讓jquery-tabs記住當表單被提交併重定向到get時的哪個選項卡。我發現了很多例子，但他們都說要在select事件中使用ui.index，這兩者都不是is in the documentation;我已確認ui.index不是該對象的一部分。在activate事件中使用$("#MyTabs").tabs("option", "selected")可以獲取先前選擇的選項卡的索引，但不是用戶剛選擇的選項卡。如在，如果選項卡0被選中，我點擊標籤3，我得到0，而不是3.我不能使用active選項，如果我不知道索引。記住選定的標籤

我應該只是計算無序列表中的列表項目，jquery將變成標籤，然後使用它們來映射ui.newPanel中的div ID，還是有更好的方法來做到這一點？一旦我有合適的索引，我可能會將其添加到查詢字符串。如果用戶打開了多個窗口或瀏覽器選項卡，Cookie解決方案就無法與我保持一致。

編輯：問題是，active選項採用的指數，但activate事件的ui參數似乎只給我的標籤，標籤內容的li和div元素。由於曾經有一個ui.index財產，我想知道如果我失去了一些東西。

編輯：這是我用於感謝庫什的解決方案;爲簡潔起見，我省略了一些代碼。

function Document_OnReady() { 
    $("#MyTabs").tabs({ 
     active: $("input.InitialTabIndex").val() 
    }); 

function SetInitialTab() { 
    $("input.InitialTabIndex").val($("#MyTabs").tabs("option", "selected")); 
} 

function Form_OnSubmit() { 
    SetInitialTab(); 
}

當服務器處理POST時，我讀取表單值，然後在重定向到get時將其添加到查詢字符串中。

謝謝！

來源

2012-12-18 Don 01001100

來源

2012-12-19 13:38:43 hsuk

謝謝，庫什。我想看看什麼是「標準」做法，但看起來並不存在。這是我在這裏看到的最好的選擇，它不依賴API定義之外的東西，但我不是jQuery專家。我最終在重定向到獲取後在查詢字符串中包含索引，以便用戶可以使用該URL，只要我不重新排序製表符！ –

通常，服務器端代碼會向所選元素添加一個類名稱，並將該頁面吐出到瀏覽器中。與

jQuery.data('key', data);

來源

2012-12-18 21:41:59

Diodeus添加，哪些服務器端代碼？如果你的意思是客戶端代碼，那麼是的，類會改變，但是這仍然讓我計算'li'標籤來找到所選擇的索引。感謝您的回覆。 –

如何處理沒有服務器端代碼的表單提交？ –

我可能在jQuery Tabs API中缺少某些東西。如何告訴API哪個類應該指示最初活動的選項卡？看到我上面的編輯。 –

記住數據的工作創建一個隱藏字段。單擊任何選項卡時，請將該選項卡索引保留在該隱藏字段中，以便下次重定向頁面時不會出現問題。您可以使用隱藏字段表單元素來重定向頁面。

$('#hidden_field').val($tabs.tabs('option', 'selected'));

來源

2012-12-19 13:35:58 algorhythm

試試這個：

<div id="selector" class="ui-mainColTabs"> 
    <ul> 
     <li><a href="#tabs-1">Tab 1</a></li> 
     <li><a href="#tabs-2">Tab 2</a></li> 
    </ul> 
    <div id="tabs-1"></div> 
    <div id="tabs-2"></div> 
</div> 

<form id="form"> 
    <input type="submit" value="Kill" /> 
</form> 

<a href="#" id="getCookie">Get</a> 

<script type="text/javascript"> 
<!-- 
$(document).ready(function() { 
    $("#selector").tabs({ 
     cookie: { 
      name: 'tab_cookie', 
      expires: 7 
     } 
    }); 


    $('#getCookie').click(function() { 
     alert($.cookie('tab_cookie')); 
    }); 

    $('#form').submit(function() { 
     alert($.cookie('tab_cookie')); 
    }); 
}); 
//--> 
</script>

您需要jQuery的cookie文件從here

來源

2012-12-19 13:38:46

記住選定的標籤

回答

相關問題