javascript - 如何使用DOJO动态显示和隐藏整个TabContainer？

DOJO在这里似乎有些古怪。我特别需要在页面加载时隐藏TabContainer，但在用户单击按钮后才可见。我尝试的第一件事是设置style.display =“none”开始，然后在click事件上设置style.display =“block”。不幸的是，这仅能部分起作用-页面将在正确的位置/尺寸上呈现一个不可见的框，但不会呈现实际的内容。仅在其他条件触发时才渲染该框的内容(例如，转到其他FF选项卡或挂起/恢复 Firebug 将使该框呈现)。

如果将style.display属性设置为在页面加载时可见，则一切正常。您可以切换显示属性，它可以正确显示或隐藏tabcontainer。但是，如果在页面加载时将其设置为“none”，则它会搞砸。

我尝试了一种变通方法，将HTML中的style.display属性设置为“”，然后立即在Javascript中将其设置为“none”，但仍然失败-更改发生得太早了，它需要在tabcontainer呈现后进行(这可能需要一两秒钟)。

一些剥离的示例代码:

HTML:
<div id="tabContainer" dojoType="dijit.layout.TabContainer" style="width:500px; height:100px;display:none;">
</div>

然后在用户上显示选项卡的Javascript单击:

function initTabs()
{
var tabContainer = dojo.byId('tabContainer');
tabContainer.style.display = 'block';
}

如何动态显示/隐藏TabContainer，而无需使其处于所示状态下启动？

最佳答案

有解决方案。如果要显示TabContainer调用，请执行以下操作:

dijit.byId("tabContainer").domNode.style.display = 'block';
dijit.byId("tabContainer").resize();

如果要隐藏TabContainer，请使用“无”。

这对我有用，但这是事实，这并不明显:)