YUI 3 TabView問題

我想使用YUI 3（Yahoo UI3）在Jsp頁面中創建兩個選項卡。YUI 3 TabView問題

例如： TAB1 TAB2

TAB1：我可以使用下面的Java腳本來創建TAB1。

createCustomTabSafari = function(lblTxt,eId){ 

YUI().use('tabview', function(Y) { 
    var tabview = new Y.TabView({ 
     children: [{ 
      label: lblTxt, 
      content: document.getElementById(eId) 
     }] 
    });  
    tabview.render('#demo'); 
    tabview.selectChild(0); 
    }); 
}

現在我想用一些靜態的文字像標籤添加TAB2：「TAB2」，內容：「測試」。我嘗試過使用createCustomTabSafari（'Tab2'，'test'），但它在其他位置創建了一個選項卡，而不是在Tab1之外創建。

如何使用addChilld（）/ add（）方法將第二個選項卡添加爲子選項而不是全新選項卡。

我已經通過YUI API並可以看到addChild（child，index）方法，但不知道如何在這個scena enter code here rio中使用此方法。

另外，如何讀取創建的選項卡，如果我知道tab1被點擊，我將顯示一些內容，如果單擊Tab2，我將顯示一些不同的東西。

如果我知道在Tab1旁邊添加第二個選項卡，將會有所幫助。

在此先感謝。

來源

2014-12-10 user3862416

YUI網站上的例子非常好地展示瞭如何使用Tabview。你可以看到這個例子有多個選項卡：http://yuilibrary.com/yui/docs/tabview/tabview-fromjs.html

YUI().use('tabview', function(Y) { 
    var tabview = new Y.TabView({ 
     children: [{ 
      label: 'foo', 
      content: '<p>foo content</p>' 
     }, { 
      label: 'bar', 
      content: '<p>bar content</p>' 
     }, { 
      label: 'baz', 
      content: '<p>baz content</p>' 
     }] 
    }); 

    tabview.render('#demo'); 
    tabview.selectChild(2); 
});

並添加和移除標籤，一個相當複雜的例子：http://yuilibrary.com/yui/docs/tabview/tabview-add-remove.html

來源

2014-12-10 22:23:44 hatch

的例子展示創建靜態標籤。我想動態地創建選項卡。首先，我想動態地創建Tab1，因爲基於某些數據/檢查Tab1可以多次顯示，但Tab2應該只顯示一次。 – user3862416 2014-12-10 22:39:11

如果您按照第二個鏈接中的詳細示例，您會看到它使用'add（）'方法。 http://yuilibrary.com/yui/docs/api/classes/TabView.html#method_add – hatch 2014-12-11 15:43:48

YUI 3 TabView問題

回答

相關問題