道场过渡到在同一个项目中的另一个HTML文件(Dojo transition to another

2019-10-16 16:37发布

我使用的Dojo 1.7。 实现与PhoneGap的一款Android手机应用程序。 那么我的问题是,我在我的项目已经实施index.html中一个的TabBar。 现在我想通过点击的TabBar图标从的index.html到view2.html的视图-DIV(称为testdiv),这是在同一个项目中的另一个HTML文件做一个过渡。

Answer 1:

使用数据道场 - 道具属性中获得url属性如下 -

index.html的-链接以查看另一页

<div id="detailsHeading" data-dojo-type="dojox.mobile.Heading"
        data-dojo-props="fixed: 'top', label: 'Details', back:'Back', moveTo:'view1', transition:'slide', transitionDir:'-1',url:'sample.html'">
</div>

上述网址属性包含要referened的HTML的名称,包含的moveTo的视图来显示(您的另一个HTML可能有多个视图)

Sample.html -视图定义

<div data-dojo-type="dojox.mobile.ScrollableView" id="view1"
    data-dojo-props="selected:false,scrollDir:'v'">
</div>

当点击“detailsHeading”,该应用程序将加载sample.html和渲染视图 - 厂景



Answer 2:

那里有没有很多通过这里进入; 但IM近100%肯定的是,“的TabBar”你讲dojox.mobile.TabBar的?

如果是这样,没有了现成偏远页面拉动支持,但你可以通过添加dijit.layout.ContentPane的TabBar做到这一点。

试试这个代码为您的项目,每个窗格负荷viewX.html

<div id="groupview1" data-dojo-type="dojox.mobile.View"
       data-dojo-props='selected:true'>
  <ul data-dojo-type="dojox.mobile.TabBar"
       data-dojo-props='barType:"segmentedControl", fixed:"top"'>
    <li data-dojo-type="dojox.mobile.TabBarButton"
        data-dojo-props='moveTo:"subview1", selected:true'>New</li>
    <li data-dojo-type="dojox.mobile.TabBarButton"
       data-dojo-props='moveTo:"subview2"'>What's Hot</li>
  </ul>

 <div id="subview1" data-dojo-type="dojox.mobile.ScrollableView"
        data-dojo-props='selected:true'>
    <ul data-dojo-type="dijit.layout.BorderContainer">
      <li data-dojo-type="dijit.layout.ContentPane"
       data-dojo-props='region:"center", href:"view1.html"'>Hello</li>
    </ul>
 </div>

  <div id="subview2" data-dojo-type="dojox.mobile.ScrollableView" data-dojo-props=''>
    <ul data-dojo-type="dijit.layout.BorderContainer">
        <li data-dojo-type="dijit.layout.ContentPane"
             data-dojo-props='region:"center", href:"view2.html"'></li>
  </ul>
</div></div>

 <script type="text/javascript">
       require(["dojox/mobile/TabBar", "dojox/mobile/TabBarButton", "dojox/mobile/TabBarButton", "dojox/mobile/ScrollableView", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!"], function() {
              dojo.parser.parse();
       });
 </script>


文章来源: Dojo transition to another html file in same project