在更改jQuery UI選項卡時重新加載所有頁面

我想在更改選項卡時刷新所有選項卡內容。例如，我有3個選項卡，當選中第二個時，我刷新第一個和第三個。其他解決方案只需點擊該標籤即可重新加載標籤內容。在更改jQuery UI選項卡時重新加載所有頁面

有什麼想法？

感謝，

我抓住不斷變化的標籤事件，像這樣：

$("#tabs").bind('tabsselect', function (event, ui) { 
    //ui.index is tab selected 
});

HTML

<div id="tabs"> 
    <ul> 
     <li><a href="#tabs-1">Choice1</a></li> 
     <li><a href="#tabs-2">Choice2</a></li> 
     <li><a href="#tabs-3">Choice3</a></li> 
    </ul> 
    <div id="tabs-1">@Html.Partial("Choice1", Model)</div> 
    <div id="tabs-2">@Html.Partial("Choice2", Model)</div> 
    <div id="tabs-3">@Html.Partial("Choice3", Model)</div> 
</div>

來源

2011-04-14 Kris-I

你能進一步解釋'實施例，我有3個突出部，選擇第二時，我刷新所述第一和第三。「？刷新意味着什麼？將內容更改爲其他內容？ – 2011-04-14 09:23:18

爲什麼要使用？

只需使用負載通過設在這裏AJAX選項：Load tab data through ajax

所以你不會需要刷新選項卡1 & 3，因爲他們arent可見:)。只需重新加載您想查看的數據，它可以節省您的頁面上的負載！

順便說一句，我與在UI選項卡演示這一功能：

$(function() { 
    $("#tabs").tabs({ 
     ajaxOptions: { 
      error: function(xhr, status, index, anchor) { 
       $(anchor.hash).html(
        "Couldn't load this tab. We'll try to fix this as soon as possible. " + 
        "If this wouldn't be a demo."); 
      } 
     } 
    }); 
});

來源

2011-04-14 09:32:26

@ Shazada ..他正在尋找點擊標籤上的東西-1他希望其他標籤加載ajax內容 – 2011-04-14 09:36:34

我明白他想要什麼，但我不明白這個邏輯。爲什麼要加載隱藏的數據.....你點擊tab-2：tab-1＆tab-3被加載。然後你點擊tab-3：再次加載tab-1。所以你在後臺重新加載相同的數據兩次，這是用戶沒有看到的，因此是開銷。 – 2011-04-14 10:17:40

你的標籤將是具有<ul>含顯示的選項卡的名稱。

<ul> 

      <li><a href="#tabs-1" id="tab-1">Tab1</a></li> 

      <li><a href="#tabs-2" id="tab-2">Tab2</a></li> 




     </ul>

而且你將有申報單的列表選項卡

<div id="tabs-1" style="width:98%;"> 

    <span style="padding-left:200px;font-size: 1em;"> &nbsp;&nbsp;&nbsp; <strong>Loading....</strong> </span> 

    </div> 

    <div id="tabs-2" style="width:98%;"> 
    <span style="padding-left:200px;font-size: 1em;"> &nbsp;&nbsp;&nbsp; <strong>Loading....</strong> </span> 
    </div>

在單擊標籤1，如果你想重新加載TAB2，只需加載標籤-2格

$（「＃標籤-1」）。的liveQuery（ '點擊'，功能（事件）{

   $("#tabs-2").load('url'); 
       });

來源

2011-04-14 09:41:00

在更改jQuery UI選項卡時重新加載所有頁面

回答

相關問題