Question

如何在创建标签时激活标签？标签栏会出现，但要向其显示内容，您必须单击它。我做了这个菜单调用来打开一个Jquery选项卡：

<a href="#" onClick="addTab('Expedi...','dialogs/grid_expedition.html','1100')">&nbsp;&nbsp;Expedition</a>

这会创建选项卡，但不会激活它。

这是tabs.js：

//Global Variables
var tabTitle = null; //Title should start null
var tabs = null;
tabCounter = 1; //Counter of tab

//Function responsible to create a new Tab and insert the content loaded
function addTab(title, content, indexx) {
    var count = $("#tabs-"+indexx).length;
    var currentTab = indexx-1;
    if(count > 0 ){
        alert('Working tab');

}else{

var label = tabTitle.val() || title,
    id = "tabs-" + indexx,
    li = $(tabTemplate.replace(/#\{href\}/g, "#" + id).replace(/#\{label\}/g, label)),
    tabContentHtml = tabContent.val() || "Tab " + tabCounter + " content.";
    tabs.find(".ui-tabs-nav").append(li);

    tabs.append("<div id='" + id + "'><p>" + content + "</p></div>");

    //to load data
    $.post( content, function( data ) {
      $( '#' + id ).html( data );
    }); 




     tabs.tabs("refresh");
    /* to Close the tab */
    tabs.delegate("span.ui-icon-close", "click", function () {
    var panelId = $(this).closest("li").remove().attr("aria-controls");
    $("#" + panelId).remove();

    //tabs.tabs("refresh"); 
});
tabCounter++;
}
}

// Function to initialize the tabs

function init() {
    tabTitle = $("#tab_title"), tabContent = $("#tab_content"), tabTemplate = "<li><a href='#{href}'>#{label}</a> <span class='ui-icon ui-icon-close' role='presentation'>Remove Tab</span></li>";
    tabs = $('#tabs').tabs({ selected: -1});
    addTab('Principal', 'dialogs/features.html');
    tabs.tabs("refresh");
}
$('document').ready(init);

此外，当您关闭选项卡时，最后一个选项卡也不会处于活动状态。

Answer 1

要以编程方式选择当前处于活动状态的选项卡，您可以使用：

tabs.tabs('option', 'active', 0);

最后一个选项是正确选项卡的索引（从0开始）。

添加Jquery选项卡并使其处于活动状态

1 个答案: