页面导航无效

时间:2014-10-17 10:05:01

标签: javascript jquery html css cordova

我是一个非常新的手机,并且不得不拿起别人的代码。我遇到了页面导航的问题。我在列表项上有一个onClick事件,并且根据布尔值,我想导航到特定页面。

用户将移动到的两个可能页面几乎完全相同。只有一个div包含列表视图。最初我只有一个页面,我用javascript动态加载了div的html,但css没有被应用到所以我决定创建一个除了上面提到的div之外几乎相同的附加页面。

我现在的问题是,我在index.html中首先创建的div(页面)将用于导航,但第二个不会用于导航。

如果我按以下顺序定义div:

<div id="page1" data-role="page"></div>

<div id="page2" data-role="page"></div>

然后导航到page1将工作,导航到第2页将不会。但是如果我改变我将div放在index.html页面中的顺序,即

<div id="page2" data-role="page"></div>

<div id="page1" data-role="page"></div>

然后导航到第2页将起作用并导航到第1页不会。

希望这是有道理的。这是我的代码:

在head标签中我有以下功能:

function SetMyAccountsBool(bool){
        MyAccountsBool=bool;

        if (CheckBool){
            alert('here');
            $.mobile.changePage("file:///Users/roseannecarroll/Documents/workspace2/GirtBank/assets/www/index.html#MyAccTrans4");
            //window.location = "file:///Users/roseannecarroll/Documents/workspace2/GirtBank/assets/www/index.html#MyAccTrans3";
            //$("#MyAccTrans3").trigger("pagecreate");

        }
        else{
            alert('here2');
            //$.mobile.changePage('#MyAccTrans');
$.mobile.changePage("file:///Users/roseannecarroll/Documents/workspace2/GirtBank/assets/www/index.html#MyAccTrans");

        }
    };

然后在listview上,我将上述函数作为onClick事件调用。它正在进入该功能,因为我正在接收警报“这里&#39;或者&#39; here2&#39;取决于布尔值。

最后,这里有两个几乎相同的div:

<div id="MyAccTrans" div class="page" data-role="page" data-theme="a" style="text-align: center;">
        <div data-role="header">
            <a href="#TransferMoney" data-rel="back" data-icon="arrow-l" data-iconpos="notext" data-role="button" data-theme="c" data-transition="slide"></a>

            <div class="centered">
                <img src="../images/log_out.png" alt="Log_Out" onclick='javascript:location.href="#loginScreen";' class="c1">
                <h3><div id="MyAccTrans_NAME"></div>Choose</h3>
            </div>
        </div>
        <div data-role="content" style="padding: 10px;text-align:center">
            <div class="centered">
                <div class="centered" id="MyAccTrans_NUMBER"></div>
            </div>
            </p>
            <div class="bookbal"><b><div id="MyAccTrans_BOOK_BAL"></div></b>
            </div>
            </p>
            <div class="accountnum">

        </div>
        <div style="padding:10px">
            <ul data-role="listview" data-divider-theme="a" data-inset="true">
                <li data-role="list-divider" role="heading">
                    Choose Existing Account To Transfer:
                </li>
                <div id="MyAccTrans_target_div" style="padding:10px">
               <ul id="MyAccTrans_ul" data-inset="true" data-role="listview" data-divider-theme="a">
        <li id="0" data-theme="c"><a href="#makeTransfer" data-transition="slide" >
        Savings - 173</a><div ><a href="#MyAccTrans" data-transition="slide"> 
        </a></div></li></ul>
                </div>
            </ul>
        </div>
        <div data-role="footer"  class="centered3" data-theme="a" >
            <a href="#" onClick="boolCheck();" class="tabBAR" data-role="button"><img src="../images/homeGrey50.png"></a>
            <a href="#exchangeCalc" class="tabBAR" data-role="button"><img src="../images/EuroGrey50.png"></a>
            <a href="#loanCalc" class="tabBAR" data-role="button"><img src="../images/CalculatorGrey50.png"></a>
            <a href="#other" class="tabBAR" data-role="button" ><img src="../images/locationGrey50.png"></a>
        </div>
</div>

<div id="MyAccTrans4" div class="page" data-role="page" data-theme="a" style="text-align: center;">
        <div data-role="header">
            <div class="centered">
                <img src="../images/log_out.png" alt="Log_Out" onclick='javascript:location.href="#loginScreen";' class="c1">
                <h3><div id="MyAccTrans_NAME"></div>Choose</h3>
            </div>
        </div>
        <div data-role="content" style="padding: 10px;text-align:center">
            <div class="centered">
                <div class="centered" id="MyAccTrans_NUMBER4"></div>
            </div>
            </p>
            <div class="bookbal"><b><div id="MyAccTrans_BOOK_BAL4"></div></b>
            </div>
            </p>
            <div class="accountnum">
        </div>
        <div style="padding:10px">
            <ul data-role="listview" data-divider-theme="a" data-inset="true">
                <li data-role="list-divider" role="heading">
                    Choose Existing Account To Transfer:
                </li>
                <div id="MyAccTrans_target_div4" style="padding:10px">

               <ul id="MyAccTrans_ul4" data-inset="true" data-role="listview" data-divider-theme="a">
        <li id="0" data-theme="c"><a href="#makeTransfer" data-transition="slide" >
        Current - 004</a><div ><a href="#MyAccTrans" data-transition="slide"> 
        </a></div></li></ul>
                </div>
            </ul>
        </div>
        <div data-role="footer"  class="centered3" data-theme="a" >
            <a href="#" onClick="boolCheck();" class="tabBAR" data-role="button"><img src="../images/homeGrey50.png"></a>
            <a href="#exchangeCalc" class="tabBAR" data-role="button"><img src="../images/EuroGrey50.png"></a>
            <a href="#loanCalc" class="tabBAR" data-role="button"><img src="../images/CalculatorGrey50.png"></a>
            <a href="#other" class="tabBAR" data-role="button" ><img src="../images/locationGrey50.png"></a>
        </div>
</div>

任何帮助表示赞赏

0 个答案:

没有答案