1

タブを動的に作成しています。すべて正常に動作していますが、デフォルトでは最後にタブが挿入されます。シナリオによっては、特定の位置にタブを追加したい場合があります。例: - Tab1,Tab2 という 2 つのタブを追加しました。3 番目のタブを追加すると、Tab1 と Tab2 の間にある index1 に追加する必要があります。

以下のようにタブを初期化する準備ができたら

   var $tabs = $( "#tabs_selector").tabs
        ({
            tabTemplate: '<li><a href='#{href}'>#{label}</a> <span class='ui-icon ui-icon-close'></span></li>',
         add: function( event, ui )
         {
            $tabs.tabs('select',ui.panel.id);
            return false;
         }
    });

// いくつかのリンクをクリックすると、タブを動的に挿入する以下の関数を呼び出します。私の質問は、最後に挿入するのではなく、その位置にタブが挿入されるように、インデックスの位置をどこかに言及できますか?

function inserTab()
 {
     var tabs = $('#tabs_selector').tabs();
     tabs.tabs( "add", url, title);// is there any idex paramter too here?
 }
4

1 に答える 1

2

追加するときは、オプションの 4 番目のパラメーターがあります。

.tabs( "add" , url , label , [index] )

そのため、追加したい場所を選択できるはずです。

「追加」メソッドは非推奨になったため、使用しないでください: http://jqueryui.com/upgrade-guide/1.9/#deprecated-add-and-remove-methods-and-events-リフレッシュ方法を使用

たぶん、このようなものがうまくいくでしょう：

// Find the first tab (change the eq(1) to get a different one)
var firstTab = $( "#tabs" ).find( ".ui-tabs-nav li:eq(1)" );
// create the new tab HTML
var newTab = $( "<li><a href='/remote/tab.html'>New Tab</a></li>" );
// add the new tab after the 1st one we found
firstTab.after(newTab);
// Refresh the tabs widget
$( "tabs" ).tabs( "refresh" );

テストされていませんが、ドキュメントに基づいて大まかに正しいはずです!

于 2012-10-16T09:37:03.073 に答える