Javascript JQuery选项卡，can´；不要更改激活选项卡

我是新来的，没有找到解决问题的办法。 我在网上搜索并尝试了大量的解决方案，但都不起作用

我使用带有可关闭特性（）的Jquery选项卡

现在我想激活最新创建的选项卡。这不管用^^

这是我的密码：

$(function () {
    var 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>",
        tabCounter = 1;
    var tabs = $("#tabs").tabs();

    // modal dialog init: custom buttons and a "close" callback resetting the form inside
    var dialog = $("#dialog").dialog({
        autoOpen: false,
        modal: true,
        buttons: {
            Send: function () {
                addTab();
                $(this).dialog("close");
            },
            Cancel: function () {
                $(this).dialog("close");
            }
        },
        close: function () {
            form[0].reset();
        }
    });
    // addTab form: calls addTab function on submit and closes the dialog
    var form = dialog.find("form").submit(function (event) {
        addTab();
        dialog.dialog("close");
        event.preventDefault();
    });

    // actual addTab function: adds new tab using the input from the form above
    function addTab() {
        var label = tabTitle.val() || "Tab " + tabCounter,
            id = tabTitle.val(),
            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 + "' class='rel'><p>" + tabContentHtml + "</p><hr /><div id='writebox'><form name='send' id ='sent'><textarea name ='msg' class='boxsizingBorder'></textarea><input type='submit' name='" + id + "' /></form></div></div>");

        //after added the tab, active it
        tabs.tabs({
            active: tabCounter
        }); // <---------------------------Here it is

        //alert(panelId+"-"+tabCounter);
        tabCounter++;
        tabs.tabs("refresh");

    }
    // addTab button: just opens the dialog
    $("#add_tab")
        .button()
        .click(function () {
            dialog.dialog("open");
        });
    // close icon: removing the tab on click
    tabs.delegate("span.ui-icon-close", "click", function () {
        var panelId = $(this).closest("li").remove().attr("aria-controls");
        $("#" + panelId).remove();
        tabs.tabs("refresh");
    });
    tabs.bind("keyup", function (event) {
        if (event.altKey && event.keyCode === $.ui.keyCode.BACKSPACE) {
            var panelId = tabs.find(".ui-tabs-active").remove().attr("aria-controls");
            $("#" + panelId).remove();
            tabs.tabs("refresh");
        }
    });
});

$（函数（）{
var tabTitle=$（“#tab_title”），
tabContent=$（“#tab_内容”），
tabTemplate=“
删除选项卡”
，
tabCounter=1；
var tabs=$（“#tabs”）.tabs（）；
//模态对话框初始化：自定义按钮和“关闭”回调重置表单内部
变量对话框=$（“#对话框”）。对话框({
自动打开：错误，
莫代尔：是的，
按钮：{
发送：函数（）{
addTab（）；
$（此）.dialog（“关闭”）；
},
取消：函数（）{
$（此）.dialog（“关闭”）；
}
},
关闭：函数（）{
表单[0]。重置（）；
}
});
//addTab表单：在提交时调用addTab函数并关闭对话框
var form=dialog.find（“form”）.submit（函数（事件）{
addTab（）；
dialog.dialog（“关闭”）；
event.preventDefault（）；
});
//实际addTab函数：使用上面表单中的输入添加新选项卡
函数addTab（）{
var label=tabTitle.val（）| |“Tab”+tabCounter，
id=tabTitle.val（），
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（“”+tabContentHtml+”
）；
//添加选项卡后，将其激活
标签，标签({
活动：选项卡计数器
})；//您可以使用以下代码以编程方式激活选项卡

$( "#tabs" ).tabs( "option", "active", 2 );

我已在您的Fiddle中更新了addTab（）方法，如下所示：

function addTab() {
    ...
    tabs.tabs("refresh");
    tabs.tabs( "option", "active", tabCounter-1 );
    tabCounter++;
}

由于选项卡索引从0开始，而不是从1开始，因此我必须从
tabCounter
中减去1才能得到刚刚添加的选项卡的索引

请参见演示
您的意思是在添加选项卡时希望它变为活动状态吗？是的，我希望它变为活动状态