0

我是 javascript 的新手,尤其是 dojo,我被困住了,我假设任务很简单,但我就是无法解决它。

基本上我想做的是以下几点:

当我单击一个列表项时,我应该被发送到另一个视图。我正在这样做:

<li data-dojo-type="dojox.mobile.ListItem"
            data-dojo-props="moveTo:'#'" onClick="transitionTo('#recommend',1);">Recommend App</li>

现在 id=recommend` 的 div 有 2 个列表项。

<div id="recommend" data-dojo-type="dojox.mobile.ScrollableView">
        <div class="belowTab" style="width: 100%;">&nbsp;</div>
            <ul data-dojo-type="dojox.mobile.RoundRectList">
                <li data-dojo-type="dojox.mobile.ListItem">via Email</li>
                <li data-dojo-type="dojox.mobile.ListItem"
                    data-dojo-props="moveTo:'#'" onClick="postToWall();">via Facebook</li>
</div>
            </ul>

如果某些特定函数返回true,我想让两个列表项都可见,否则隐藏第二个列表项并仅显示第一个。我想知道逻辑以及如何实现将 if 语句与 div 集成在一起的想法

4

1 回答 1

0

有一种创建事件钩子作为标记的方法记录很差,我将在这里演示。但是,最好在您的代码库中创建一个函数,然后将其设置为 dojoProps 属性,例如function myonclick() { ... }and <div data-dojo-type="dijit._Widget" data-dojo-props="onClick: myonclick"></div>

为此,您需要弄清楚View小部件提供了哪些事件。执行此操作的简单方法是简单地打开dojotoolkit-src/dojox/mobile/View.js文件 - 您正在寻找的可能是onStartView || onBeforeTransitionIn

通过标记,我们现在为 onBefore.. 创建 dojo/method,以便您可以操作列表中的子项。顺便说一句,你有一个杂散的结束</div>标签。

<div id="recommend" data-dojo-type="dojox.mobile.ScrollableView">
    <div class="belowTab" style="width: 100%;">&nbsp;</div>
    <ul data-dojo-type="dojox.mobile.RoundRectList">
        <li data-dojo-type="dojox.mobile.ListItem">via Email</li>
        <li data-dojo-type="dojox.mobile.ListItem"
              data-dojo-props="moveTo:'#'" onClick="postToWall();">via Facebook</li>
    </ul>

    <script type="dojo/method" event="onBeforeTransitionIn" args="moveTo, dir, transition, context, method">
          // onBeforeTransitionIn(moveTo, dir, transition, context, method):
          var listWidget = dijit.byNode(dojo.query("#recommended ul")[0]);
          // say you have a function with true/false return, if item should show
          dojo.forEach(listWidget.getChildren(), function(Item, idx) {
              dojo.style(Item.domNode, {
                   display: showItem(Item) ? '' : 'none'
              });
          });
    </script>
</div>
于 2012-08-25T22:36:03.763 回答