有什么想法，为什么我的dojo TabContainer乱七八糟的？

Question

我有一个包含Dojo TabContainer的网站，我一直在尝试将Dojo库从1.2升级到更高版本。

在1.5中，我遇到了一个问题。

这是在1.5中Firefox中TabContainer的样子，以及在先前版本中所有浏览器（IE，Chrome，Safari）中看起来的样子。 （IE9中的样子如下所示）

我无法找出这些箭头按钮来自何处。样式和标记没有改变，我只是更换了Dojo库。

以下是代码：

<asp:Repeater ID="TabRepeater" runat="Server">
    <HeaderTemplate>
      <div dojoType="dijit.layout.BorderContainer" gutters="false" style="width:600px">
        <div dojoType="dijit.layout.TabContainer" style="width:600px; height:350px">
    </HeaderTemplate>
    <ItemTemplate>
      <div dojoType="dijit.layout.ContentPane" style="display:none; height:300px" title="<%#Eval("Name")%>">
        <!-- Content -->
      </div>
    </ItemTemplate>
    <FooterTemplate>
        </div> <!-- End Tab Container -->
      </div> <!-- End Border Container -->
    </FooterTemplate>
</asp:Repeater>

这很基础，我已经定义了容器的大小。我不确定为什么这些滚动按钮不会消失。我不确定这是我的代码问题还是TabContainer的问题，因为他们的文档站点在IE9中甚至都无法正常工作。

FF:

IE9: 有什么想法吗？

- Brandon

Answer 1

Dojo 1.5 官方不兼容 IE9。自 Dojo 1.6.x 开始，官方已经部分支持兼容性，并且应该在 Dojo 1.7.x 中实现完全兼容。

此外，我对 asp 不是很了解，但这看起来不是一个好的做法。

<HeaderTemplate>
  <div dojoType="dijit.layout.BorderContainer" gutters="false" style="width:600px">
    <div dojoType="dijit.layout.TabContainer" style="width:600px; height:350px">
</HeaderTemplate>

要让一个“标签”（除非该标签消失且未被任何HTML替换）包含未关闭的div...

- PEM

---

FooterTemplate将关闭divs。谢谢您的答案。我想我别无选择，只能不断升级并希望问题能够自行解决。如果在接下来的几天内没有其他人提出建议，我将接受这个答案。 - Brandon

我们不得不在升级到1.6版本的Dojo之前以IE8兼容模式运行IE9。 Dojo 1.5明显存在ie9问题。 - mtyson

Answer 2

我使用的是 dojo 1.10.4，遇到了同样的问题。我没有使用 asp.net。

我通过设置 TabContainer 类的属性 useMenu 和 useSlider 来解决这个问题：

var container = new TabContainer(
  {
    style: 'height: 100%; width: 100%;',
    useMenu: false,
    useSlider: false
  }, domConstruct.create('div'))

感谢David Walsh的帮助。

- iled