jqueryのeasyUiは、動的にデータラベルに基づいてタブを作成します

    <リンクのrel = "スタイルシート" タイプ= "テキスト/ cssの" のhref = "tabs.css">

    ます。<script type = "text / javascriptの" SRC = "jquery.min.js"> </ SCRIPT>

    ます。<script type = "text / javascriptの" SRC = "jquery.easyui.min.js"> </ SCRIPT>

<divのスタイル= "マージン下：10pxの"> 
        <a href="#" class="easyui-linkbutton" onclick="testTabs([3]);"> </a>のグーグル
    </ div> 
    <divのID = "texttabs"クラス= "easyui -tabs"スタイル= "幅：500pxなど;高さ：400ピクセル;"> </ div> <！ - コンテナ---> 

    <スクリプトタイプ= "テキスト/ JavaScriptを"> 関数testTabs（ ARR）{
             // このメソッドは、複数回のtestTabs（と呼ばれる）メソッドは（無限にtestTabsが増加します）の3つのタブでは、すべてあなたが繰り返し呼び出す必要があるか、あなたは（testTabsを呼び出す前に再度削除する前に、タブを必要とする）であるために（VAR。I = $（ '＃1 texttabs'）タブ（ 'タブ'）長さ- 1 ;. I> = 0; i-- ）{ 
                $（ "#texttabs"）、タブ（ '閉じる' 、I）。
            } VARコンテンツ= "<テーブルID = 'データグリッド'> </ TABLE> <DIV ID = 'dataGridPage'> </ div>"
        
            
            ;
             ヴァール LEN = arr.length;
             IF（LEN> 1。）{
                 // ダイナミックサイクルはタブを追加
                するために（VARの I = 0;私がlen <;私は++ ）{ 
                    $（ '#Texttabs'）タブ（ '追加' 、{ 
                        タイトル： '...' 、
                        内容： "" 、
                    }）; 
                } 
                // タブのプロパティの設定 
                （ '＃のtexttabs' $を）.tabs（{ 
                    ボーダー：falseに、
                    フィット：falseに、
                    onSelect：機能（タイトル、インデックス）{ 
                        にconsole.log（インデックス）
                        VaRの合計= $（ '＃のtexttabs'）、タブ（ 'タブ'。）.LENGTH 
                        $（ '#texttabs'）タブ（ '更新'。、{ 
                            タブ：$（ '#texttabs'）、タブ（ 'getTab' 、インデックス）、
                            オプション：{ 
                                コンテンツ：コンテンツ、
                            } 
                        }）。
                        以下のために（VAR I = 0; iの合計を<;私は++ ）{
                             場合（I =！インデックス）{
                                console.log（I）
                                $（ '#texttabs'）タブ（ '更新'。、{ 
                                    タブ：$（ '#texttabs'）、タブ（ 'getTab' 、I）、
                                    オプション：{ 
                                        内容：「<B> < / B>」、
                                    } 
                                }）。
                            } 
                        } 
                        のsetTimeout（関数（）{ 
                            のCreateTable（）; 
                        }、 500 ）
                    } 
                }）。
                $（ '#texttabs'）タブ（ '選択'、0。）; 

            } 他{ 
                $（ （'#texttabs'）タブの'追加'。、{ 
                    タイトル： '测试のTABS1' 、
                    コンテンツ：コンテンツ、
                ）}; 
                setTimeout（関数（）{ 
                    のCreateTable（）; 
                }、 500 ）
            } 
        }