Question

我正在动态创建标签。一切正常。但默认情况下，它最后插入标签。在某些情况下，我想添加特定位置的选项卡。例如： - 我添加了两个选项卡，即Tab1，Tab2。现在，如果我添加第三个标签，它应该在index1处添加在Tab1和Tab2之间

准备好初始化选项卡，如下所示

   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?
 }

Answer 1

添加一个时有一个可选的第四个参数：

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

所以你应该可以选择你想要添加的地方！

虽然您可能不应该使用“添加”方法，因为它已被弃用：http://jqueryui.com/upgrade-guide/1.9/#deprecated-add-and-remove-methods-and-events-use-refresh-method

也许这样的事情会起作用：

// 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" );

未经测试，但应根据文档大致正确！

在特定位置插入新标签？

1 个答案: