Javascript 如何在关闭选项卡时将dojo内容选项卡焦点更改为上一个选项卡而不是第一个选项卡？

我正在使用

Dojo

的

Dijit布局

生成类似于

Dijit

的内容选项卡窗格。这里的所有选项卡都可以关闭

问题是：当我关闭一个选项卡时，它会返回到列表中的第一个选项卡，而不是上一个选项卡（在它旁边可用）

你可以把它想象成在Firefox或Chrome中打开一个新标签，然后尝试关闭最后一个标签。。。。在关闭选项卡时，它将焦点更改为上一个选项卡，这是使用选项卡的可预测行为。但是使用

dijit.TabContainer

s，默认情况下它会返回到第一个选项卡，而不是上一个选项卡。当你考虑UI基础时，这是一个严重的缺陷。

---

我已经查看了dojo的文档，但是没有发现任何提示。知道怎么做吗？

好的，当点击dijit.layout.ContentPane（选项卡）上的[X]按钮时，一个事件一旦生成，dijit.layout.TabContainer就会监听这个事件，因此当发生这种情况时，它会执行回调closeChild（）然后执行函数removeChild（），最后一个是您应该覆盖的函数

tabContainer从dijit.layout.StackContainer继承了这两个函数。您应该查看API文档

因此，为了能够修改关闭选项卡的默认行为，您应该覆盖默认功能，在下面的示例中，我这样做。阅读评论，了解在何处添加逻辑的信息

例如

要求([
“dojo/parser”，
“dojo/_base/lang”，//这是一个具有扩展功能的
“dojo/topic”，//这在重写的函数中是必需的
“dijit/layout/TabContainer”，
“dijit/layout/ContentPane”，
“dojo/domReady！”
]，函数（解析器、lang、主题、tabContainer、contentPane）{
Parser.parse（）；
//这将扩展tabContainer类，我们将重写所讨论的方法
lang.extend（tabContainer{
//我从dijit.layout.StackContainer类复制了这个函数
removeChild:function（/*dijit.\u Widget*/page）{
//要使其工作，我必须添加字符串“startup”作为第一个参数
继承的（“启动”，参数）；
如果（此项已启动）{
//还必须在require语句中调用dojo.topic类
topic.publish（this.id+“-removeChild”，第页）；
}
如果（此._后代被销毁）{return；}
if（this.selectedChildWidget==页面）{
this.selectedChildWidget=未定义；
如果（此项已启动）{
var children=this.getChildren（）；
if（儿童长度）{
//这就是您要添加逻辑的内容
//var子项（数组）包含所有选项卡的列表
//索引从左到右选择选项卡
//最左边是0索引
选择child（childs[0]）；
}
}
}
如果（此项已启动）{
这个布局（）；
}
}
});
//现在您可以使用修改后的tabContainer walaaaaaaaaa！
//从现在开始，正常的编程选项卡创建
var tc=新标签容器({
样式：“高度：100%；宽度：100%；”，
}，“选项卡容器分区id”）；
var cp1=新内容窗格({
标题：“第一个选项卡”，
closable:对
});
tc.addChild（cp1）；
var cp2=新内容窗格({
标题：“第二个标签”，
closable:对
});
tc.addChild（cp2）；
var cp3=新内容窗格({
标题：“第三个标签”，
选择：正确，
closable:对
});
tc.addChild（cp3）；
tc.startup（）；
});

在Dojo 1.10中，恢复到上一个选项卡是TabContainers的正常行为（而不是恢复到第一个选项卡）

大概，您可以使用

dojo/aspect

获取旧行为（警告：未测试）：

或者，您也可以使用选项卡的

ContentPane

上的

onClose

扩展点：

require( [ 'dijit/registry', 'dojo/_base/lang' ],
    function( registry, lang ) {
        newTabPane.onClose = lang.hitch(this, function () {
            // select first
            var tabContainer = registry.byId('tab_container'),
                all_tabs = tabContainer.getChildren();
            tabContainer.selectChild( all_tabs[0] );

            // allow save to go ahead
            return true;
        });
    }
);

显然，这两种方法都允许您在关闭的选项卡上选择一个特定的不同窗格，而不是进行一些调整

require( [ 'dijit/registry', 'dojo/aspect', 'dojo/_base/lang' ],
    function( registry, aspect, lang )
    {
        var tabContainer = registry.byId( 'tab_container');
        aspect.before( tabContainer, 'removeChild', lang.hitch( tabContainer, function( page )
        {
            if(this.selectedChildWidget === page)
            {
                this.selectedChildWidget = undefined;
                if(this._started)
                {
                    var children = this.getChildren();
                    this.selectChild( children[0] );
                }
            }

            return page;
        } ) );
    }
);

require( [ 'dijit/registry', 'dojo/_base/lang' ],
    function( registry, lang ) {
        newTabPane.onClose = lang.hitch(this, function () {
            // select first
            var tabContainer = registry.byId('tab_container'),
                all_tabs = tabContainer.getChildren();
            tabContainer.selectChild( all_tabs[0] );

            // allow save to go ahead
            return true;
        });
    }
);