选项卡容器刷新

TabContainer refresh

本文关键字:刷新 选项      更新时间:2023-09-26

>我在一个页面中使用 dojo 创建了多个选项卡,我想每 5 秒刷新一次页面,但只想刷新 i每 5 秒指向的当前选项卡。请找到小提琴 http://jsfiddle.net/5yn2hLv9/4/。

下面是示例代码:

<div dojoType="dijit.layout.TabContainer" style="width: 100%;height: 100px" tabStrip="true">
    <div dojoType="dijit.layout.ContentPane" title="First tab" selected="true">
        11
    </div>
    <div dojoType="dijit.layout.ContentPane" title="Second tab">
        2222
    </div>
    <div dojoType="dijit.layout.ContentPane" title="Last tab">
        333333
    </div>
</div>

--编辑--

每 5 秒页面刷新一次后,页面上显示所有 3 个选项卡数据并且页面正在加载,我想避免在加载时在页面上显示所有选项卡数据,

因为在我的应用程序中,每个选项卡都包含大量数据,每次刷新时它都会显示从所有选项卡获取的大量数据。

xaris08 所说的关于在不重新加载页面的情况下加载选项卡是真的,您应该使用我推荐的特定于选项卡的 ajax,但要回答您的问题,如果您坚持使用重新加载页面,我不建议您像下面的代码一样做一些肮脏的方式。

<div dojoType="dijit.layout.TabContainer" style="width: 100%;height: 100px" tabStrip="true">
    <div dojoType="dijit.layout.ContentPane" title="First tab" selected="true">
     <div id="content1"></div>
    </div>
    <div dojoType="dijit.layout.ContentPane" title="Second tab">
     <div id="content2"></div>
    </div>
    <div dojoType="dijit.layout.ContentPane" title="Last tab">
       <div id="content3"></div>
    </div>
</div>

require(["dijit/layout/TabContainer", "dijit/layout/ContentPane", "dojo/parser"]);
  setTimeout(function () { location.reload(true);}, 8000);
    require(["dojo/html", "dojo/dom", "dojo/on", "dojo/domReady!"],
    function(html, dom, on){
     setTimeout(function () { 
       html.set(dom.byId("content1"), "11");
       html.set(dom.byId("content2"), "22222");
       html.set(dom.byId("content3"), "33333333");
               }, 1000);

  });

这样,每次加载页面时,您都会给选项卡一些时间来呈现,一秒钟就足够了,然后您使用html.set在dom中注入值。 看这里

您应该在外部div 元素(容器)中放置一个 id,然后您将能够通过以下方式获取选定的选项卡:

dijit.byId('id_of_outer_div').selectedChildWidget

但我不确定您是否只能使用特定选项卡使用 location.reload() 重新加载。