Question

我正在尝试开发一个由多个可滚动视图组成的简单应用程序，但是从“Home”视图到“view1”之类的视图之间的导航不起作用。无法找出原因...

HTML：

<!DOCTYPE HTML>
<html>
        <head>
            <meta charset="UTF-8">
            <title>index</title>
<meta name="viewport"
    content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="shortcut icon" href="images/favicon.png">
            <link rel="apple-touch-icon" href="images/apple-touch-icon.png">
            <link rel="stylesheet" href="css/main.css">
            <script>window.$ = window.jQuery = WLJQ;</script>
            <script type="text/javascript" src="dojox/mobile/deviceTheme.js"></script>
            <script type="text/javascript" data-dojo-config="isDebug: false, async: true, parseOnLoad: true, mblHideAddressBar: false" src="dojo/dojo.js"></script>
        </head>
        <body style="display: none;">

    <div data-dojo-type="dojox.mobile.ScrollableView" id="Home">
        <div class="wraper" data-dojo-type="dojox.mobile.Container">
        <img src="images/Shelter1.png" alt="some_text">
        </div>
        <ul data-dojo-type="dojox.mobile.TabBar" fixed="bottom">
            <li data-dojo-type="dojox.mobile.TabBarButton" icon="images/Arrow-turn-right-icon.png" data-dojo-props="moveTo:view1">Label</li>
        </ul>
    </div>

<div data-dojo-type="dojox.mobile.ScrollableView" id="view1">
    <div class="wraper" data-dojo-type="dojox.mobile.Container">
        <img src="images/Shelter2.png" alt="View">
        </div>
        <ul data-dojo-type="dojox.mobile.TabBar" fixed="bottom">
            <li data-dojo-type="dojox.mobile.TabBarButton" icon="images/Arrow-turn-left-icon.png" data-dojo-props="transition:'flip',dir:'-1',moveTo:Home">Previous</li>
            <li data-dojo-type="dojox.mobile.TabBarButton" icon="images/Arrow-turn-right-icon.png" data-dojo-props="transition:'flip',dir:'1',moveTo:view2">Next</li>
        </ul>
    </div>
    <div data-dojo-type="dojox.mobile.View" id="view2"></div>
            <script src="js/initOptions.js"></script>
            <script src="js/main.js"></script>
            <script src="js/messages.js"></script>
        </body>
</html>

Answer 1

您moveTo中的ID周围缺少引号。例如：

<li data-dojo-type="dojox.mobile.TabBarButton" icon="images/Arrow-turn-right-icon.png" data-dojo-props="moveTo:view1">Label</li>

应该成为：

<li data-dojo-type="dojox.mobile.TabBarButton" icon="images/Arrow-turn-right-icon.png" data-dojo-props="moveTo:'view1'">Label</li>

这样它会起作用，我在JSFiddle上测试了它（我使用了图像占位符）。了解您是否需要报价的最佳方法是查看API documentation。如果你看一下moveTo属性，你会注意到它前面有一个[S]图标，这意味着它是一个字符串（字符串确实需要引号）。

Answer 2

以下示例代码构建在provided to you in this question之上; view内添加了scrollableView左右的时间，您可以使用moveTo属性在它们之间移动，也可以使用selected属性选择要显示的默认视图在scrollableView。

内

示例代码： http://pastebin.com/SD0SU3wV

<强>文档

编辑： Dimitri的回答确切地说明了您的确切错误，我的示例有点简化...... 我和他一起去。： - ）

IBM Worklight - 无法在视图之间导航

2 个答案: