0

我正在尝试在现有应用程序中使用 dojo 实现选项卡控件。这是我所做的一些事情：

<head> 
.....
<script type="text/javascript" src="js/dojo/dojo/dojo.js')}"></script>
<script type="text/javascript">
dojo.require("dijit.layout.TabContainer");
dojo.require("dijit.layout.ContentPane");
</script>
....
</head>
<body>
....
<div data-dojo-type="dijit.layout.TabContainer" style="width: 400px; height: 100px;" tabStrip="true">
    <div data-dojo-type="dijit.layout.ContentPane" title="title1" selected="true">
 ...content...
</div>
<div data-dojo-type="dijit.layout.ContentPane" title="title2">
...content...
</div>
</div>
....
</body>

js 正确加载（萤火虫显示没有错误）。

当我浏览到该页面时，我看到所有内容 div 都被绘制，就好像根本没有进行任何格式化，它们只是普通的 div。

我的第一个猜测是我打算包含一个 css 文件。我发现的所有示例都链接到一个非常复杂的 css 文件，该文件做了很多不适合我的应用程序的东西。我找不到任何关于应该包含的 css 的解释，所以我怀疑这个猜测是错误的。

谁能指出我的错误，或者指出一个简洁和最新示例的方向？

4

1 回答 1

0

小部件是否已创建？在浏览器的控制台中运行dijit.registry将显示已创建的小部件。

如果尚未创建，则需要配置 dojo 以解析 html。

<script type="text/javascript" src="dojo/dojo.js"
  data-dojo-config="parseOnLoad: true"></script>

Dojo 使用主题为小部件提供外观和感觉。为此，您应该添加以下 css：

<link type="text/css" rel="stylesheet" href="dijit/themes/dijit.css" />
<link type="text/css" rel="stylesheet" href="dijit/themes/claro/claro.css" />

并将 claro 类添加到 body 节点：

<body class="claro"/>
于 2012-06-27T11:59:25.547 回答