Question

我在XDK的index.html中有2个页面。我从一个导航到另一个。我想像模板一样添加一个后退按钮，但这是不可能的。

这是我的HTML：

    <div class="upage vertical-col left" id="mainpage">
        <div id="SubPage" class="upage-content vertical-col left ">
            <div class="tarea widget uib_w_1 d-margins" data-uib="media/text" data-ver="0" name="uib_w_1">
                <div class="widget-container left-receptacle"></div>
                <div class="widget-container right-receptacle"></div>
                <div class="text-container">
                    <p>This is the main page</p>
                </div>
            </div>
            <button class="btn widget uib_w_2 d-margins btn-default" data-uib="twitter%20bootstrap/button" data-ver="1" id="buttonSubPage">Go to sub page</button>
        </div>
        <div id="SubPage2" class="upage-content vertical-col left hidden"><span class="widget uib_w_3 d-margins badge" data-uib="twitter%20bootstrap/badge_and_label" data-ver="1">This is subfile 2</span>
        </div>
    </div>

我想将后退按钮添加到＆＃34; SubPage2＆＃34;。我怎样才能做到这一点？我正在使用应用设计器中的空白模板。

Answer 1

添加此代码

$(document).ready(function(){
  $("#buttonSubPage").click(function(){
    $(".text-container").hide();
    $("#SubPage2").show();
  });
});

See Fiddle

Answer 2

将标题添加到应用程序设计器后，切换到“代码”视图，在新创建的标题中查找以下代码

＆lt; div class =“widget-container content-area horiz-area wrapping-col left”＆gt;＆lt; / div＆gt;

然后添加按钮代码

＆lt; button data-uib =“twitter％20bootstrap / button”data-rel =“back”data-ver =“1”id =“back”＆gt;返回＆lt; / button＆gt;

data-rel控制后退操作，无需额外的javascript。

在顶部的应用程序设计器intel xdk中添加软件返回按钮

2 个答案: