使用 Dojo 链接到特定选项卡/内容窗格

Question

我想从 html 站点上的链接导航到具有两个不同选项卡的 TabContainer 所在的另一个链接。

我在目标 html 文件中默认选择了一个选项卡（我想保留该选项卡）。

我必须如何放置链接才能使其正常工作？我在网上找到了几个文档，但没有任何效果。所以可能需要有人以愚蠢的方式向我解释这一点。

这是目标 TabContainer：

<div dojoType="dijit.layout.TabContainer" region="center" tabStrip="true">
<div dojoType="dijit.layout.ContentPane" title="Contact" selected="true">
some text
</div>
<div dojoType="dijit.layout.ContentPane" title="Imprint" selected="true">
some text
</div>

我想放置一个链接以自动导航到标题“Imprint”。

有人可以帮忙吗？

非常感谢，祝一切顺利 TTP

Answer 1

您可以从 javascript 选择它，也可以从服务器生成选项卡的标记，并将 selected 属性设置为 true （您需要将另一个设置为 假）。第二种选择取决于您的服务器技术。

对于第一个选项，将 id 添加到容器和选项卡中，并在页面加载完成时选择选项卡。例如：

<div id="tabContainer" dojoType="dijit.layout.TabContainer" region="center" tabStrip="true">
  <div id="tab1" dojoType="dijit.layout.ContentPane" title="Contact" selected="true">
    some text
  </div>
  <div id="tab2" dojoType="dijit.layout.ContentPane" title="Imprint" selected="false">
    some text
  </div>
</div>

<script>
  dojo.ready(function() {
    dijit.byId('tabContainer').selectChild(dijit.byId('tab2'));
  });
</script>

如果您想动态选择任一选项卡，则需要将 URL 中的某种参数传递到您的页面。您可以使用查询参数（? 符号后面的变量）或哈希片段（# 后面的任何内容）。您可以从服务器和 JavaScript 读取查询参数。哈希片段，仅来自 javascript。

您可以通过检查 location 对象来访问这些参数。例如，使用哈希片段，您可以链接到您的页面，例如 http://host/page.html#imprint。然后在上面的

<script>
  dojo.ready(function() {
    if (location.hash == '#imprint') {
      dijit.byId('tabContainer').selectChild(dijit.byId('tab2'));
    }
  });
</script>

对于查询参数，另请参阅 dojo.queryToObject()。