在頁面加載準備就緒時在標籤中加載內容

我有一個包含一些選項卡的頁面。在每個標籤中都有內容。在加載頁面時，所有內容都顯示在一個之下。當頁面完全加載時，內容分別放入標籤中。我希望在頁面加載完成時顯示標籤中的內容，並且在加載時不在主頁上顯示。頁面被100％加載完畢後，TAB切換工作完美在頁面加載準備就緒時在標籤中加載內容

下面請找出標籤的代碼：

<div id="tabs" class="tabset-holder"> 
      <ul class="tabset"> 
      <li><a href="#overview" class="tab active"><span>Overview</span></a></li> 
      <li><a href="#features" class="tab"><span>Features</span></a></li> 
      <li><a href="#screenshots" class="tab"><span>Screenshots</span></a></li> 
      <li><a href="#video" class="tab"><span>Video</span></a></li>    
      </ul> 
     </div>

例如，如果截圖被點擊，下面的DIV將顯示：

<div class="tab-content" id="screenshots"> 
    <p>TEST</p>    
</div>

來源

2012-03-07 Rene Zammit

你可以看看來自twitter的框架：http：//twitter.github.com/bootstrap/這使得整體更容易。 – steveoh 2012-03-07 09:40:55

-1

第一次用戶點擊時沒有顯示標籤並從服務器端頁面獲取他們的內容時使用ajax調用。只看JQuery的文檔

$.ajax()

功能

來源

2012-03-07 09:38:28

我該怎麼做？ – 2012-03-07 09:39:01

使用CSS（display:none）隱藏容器，

然後顯示該容器，在jQuery的UI選項卡的選項卡加載事件：

$(".selector").tabs({ 
    load: function(event, ui) { 
     $('#container').show(); 
    } 
});

來源

2012-03-07 09:39:17 Headshota

將以下CSS樣式添加到您的頁面以使頁面加載時隱藏tab-content div。

.tab-content { 
    display: none; 
}

然後，jQueryUI將負責在頁面準備好後使正確的選項卡可見。

來源

2012-03-07 09:39:31

很好的答案，不知道。 – Headshota 2012-03-07 09:41:23

不工作：/正在隱藏內容，但是當我點擊一個標籤時，內容不顯示。 – 2012-03-07 10:34:37

在頁面加載準備就緒時在標籤中加載內容

回答

相關問題