jquery回發，回發後保持相同的選項卡

我正在使用jquery選項卡和以下js方法，如何以及我可以修改它以維護回發之間的選項卡狀態？（這Page_Load中之後重置選項卡，第一個選項卡）jquery回發，回發後保持相同的選項卡

$(document).ready(function() { 

     //When page loads... 
     $(".tab_content").hide(); //Hide all content 
     $("ul.tabs li:first").addClass("active").show(); //Activate first tab 
     $(".tab_content:first").show(); //Show first tab content 

     //On Click Event 
     $("ul.tabs li").click(function() { 

      $("ul.tabs li").removeClass("active"); //Remove any "active" class 
      $(this).addClass("active"); //Add "active" class to selected tab 
      $(".tab_content").hide(); //Hide all tab content 

      var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content 
      $(activeTab).fadeIn(); //Fade in the active ID content 
      return false; 
     });

來源

2010-01-27 rs.

您可以在一個隱藏字段使用Javascript跟蹤活動選項卡，然後選中隱藏字段加載頁面時。（也用Javascript）

另外，你可以使用UpdatePanels與ASP.Net AJAX消除回發。（請注意，如果標籤是在更新面板，他們將無法正常工作）

來源

2010-01-27 20:12:27 SLaks

我用更新面板不會導致回發。 – 2010-02-01 20:16:23

我還使用了隱藏字段來跟蹤選定的標籤。有用。 – 2010-03-17 23:20:18

我用更新面板..但是當我做一個按鈕點擊第二個選項卡時，回發導致顯示第一個選項卡...爲什麼？ – Muhammedh 2014-08-04 09:53:57

使用隱藏域另一種方法是使用cookie屬性選項卡控件

$（「＃標籤「（{ cookie：{ expires：1 } }）;

您需要引用jquery.cookie.js文件，這個工作

jQuery tabs cookie

來源

2012-02-08 14:20:21 Simian

完美地工作。最簡單，最優雅的解決方案。 – MGOwen 2014-03-05 04:39:13

對此的任何工作示例都將非常有幫助！ – Muhammedh 2014-08-04 09:42:28

jQuery UI淘汰了cookie業務1.10 http://jqueryui.com/upgrade-guide/1.9/#deprecated-cookie-option – fortboise 2015-04-03 22:23:15

嘗試以下操作：

<p class="hiddenData"><asp:HiddenField ID="hdnData" runat="server" /></p> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.tabs li a').click(function() { }); 
     $('.tabs li').hover(function() { 
      var liData = $(this); 
      $('.hiddenData input:hidden').val(liData.find('span').text()); 
     }); 
     if ($('.hiddenData input:hidden').val() != '') { 
      var liList = $('.tabs li'); 
      var hiddenData = $('.hiddenData input:hidden').val(); 
      liList.each(function() { 
       if ($(this).find('span').text() == hiddenData) { 
        $(this).find('a').click(); 
       } 
      }); 
     } 
    }); 
</script>

來源

2012-10-04 09:07:12

你說

//When page loads... 
$(".tab_content").hide(); //Hide all content

我會加載這與CSS，因爲這是更快。隱藏可能是在做一個顯示：無;

解決方案之一就是從代碼隱藏中編寫javascript代碼。
和示例用C＃

var selectedTab = IsAdvancedSearch ? "{'selected':1}" : String.Empty; 
ScriptManager.RegisterClientScriptBlock(this, GetType(), "search", String.Format(@"jQuery(document).ready(function() {{ jQuery('#search').tabs({0}); }});", selectedTab), true);

或者你可以將屬性和C＃添加到＃搜尋標籤，並用JS閱讀

C＃

search.Attributes.Add("selectedtab", "1");

jQuery("#search").attr("selectedtab");

另一個解決方案是查詢字符串。
您可以從查詢字符串讀取值。

我會親自挑選第一個或第二個。

來源

2012-10-04 09:34:51 VRC

隱藏字段的方法適合我。用含有

<asp:HiddenField runat="server" ID="hfLastTab" Value="0" />

在.aspx和含有

$("#tabs").tabs({ active: <%= hfLastTab.Value %> });

活動選項卡的JS準備函數將每隱藏字段進行設置。（這是jQuery UI v1.9屬性，'active'f.k.a.'selected'）。回發的各種控件可以提供將hfLastTab.Value設置爲適當的索引。

我也希望能夠指向一個特定的選項卡與另一個頁面的URL，並花了很多時間抖動添加並嘗試解析一個哈希ref結束之前，去查詢字符串參數？噸= N。我將其解析爲Page_Load（）的！Page.IsPostback分支。對於全新的頁面加載，如果沒有指定任何內容，則轉到製表符0;如果查詢字符串具有參數，則轉到製表符N。很多方式來處理解析。這裏有一個：

 if (!Page.IsPostBack) { 
      string pat = @"t=(\d)"; 
      Regex r = new Regex(pat, RegexOptions.IgnoreCase); 
      Match m = r.Match(Request.Url.Query); 
      if (m.Success) hfLastTab.Value = m.Groups[0].ToString(); 
     }

來源

2015-04-10 18:13:30 fortboise

jquery回發，回發後保持相同的選項卡

回答

相關問題