0

アプリをテストするために携帯電話を使用している場合、デバイスの戻るボタンを使用して前のページを表示します。これは、前のページにアクセスしようとしたときにスタイル設定されていないページを表示する 1 つのページを除くすべてのページで機能しているため、何かがあります奇数。
ここで簡単な説明。#main_menu 、 #first_map 、 #second_map の 3 つのページがあります。 #second_map ページに入ると、戻るボタンを押すと #first_page に移動するはずですが、実際には css スタイルではない #main_menu ページが表示されます。何が問題なのか、どのように修正できるのか教えていただけますでしょうか。よろしくお願いします。ソースコードを提供します: これは main_page です 

            </div>
            <h2 id="thx_msg" style="margin:0 auto;"></h2>
           <div class="grid2">
                <div class="first" id="search_btn">
                    <div>
                        <img src="images/loupe.jpg"/>
                    <div>
                    </div>Search for a Spot</div>
                </div>
                <div class="second" id="submit_spot_btn">
                    <div>
                        <img src="images/spot.jpg"/>
                    </div>
                    <div>Submit a spot</div>
                </div>
            </div>
            <ul style="margin:0 auto;" class="spaced_list" style="widht:280px;" >
                <li><input type="button" data-role="none" value="Account info" class="btn" style="margin:0 auto;" id="main_page_account_info"/></li>
                <li><input type="button" data-role="none" value="Log Out" class="btn" style="margin:0 auto;"id="main_page_log_out"/></li>
            </ul>
     </div>

これが first_map ページで、spot_page という名前です

<div data-role="page" id="spot_page" data-theme="b">
<div data-role="header" style="overflow:hidden;">
    <img class="logo_icon" src="images/logo_icon.png">
</div><!-- header -->
<div class="clear"></div>
<div id="search_form_holder" style="margin:0px 25px" >
    <p class="center" style="font-size:16px;font-weight:bold;">
        Search for a Spot
    </p>
    <ul class="some_space" style="margin:0 auto;
                                        margin-left:auto;
                                        margin-right:auto;
                                        align:center;
                                        text-align:center;
                                        width:280px;">
    <li><input type="text" id="address_zip" class="field black" placeholder="Address/Zip Code"/></li>
    <li id="to"></li>
    <li><input type="button" data-role="none" style="width:200px;margin:15px auto;" id="search_spot_btn" class="btn" value="Search for a Spot"></li>
    </ul>
    <div id="hidden_scroller" style="display:none">
    <select id="distance" name="Within">
            <option value="1">1 Mile</option>
            <option value="3">3 Miles</option>
            <option value="5">5 Miles</option>
            <option value="10">10 Miles</option>
        </select>
    </div>
</div><!-- search form -->
<div id="first_map" style="width: 100%;
                            height: 247px;border:1px solid black;margin:0 auto">

</div>
</div><!-- split  view -->

最後に 2 番目のマップ:

        <div data-role="page" id="nearby_page">
        <div data-role="header" style="overflow:hidden;">
            <img class="logo_icon" src="images/logo_icon.png">
        </div><!-- header -->
        <div class="clear"></div>
        <div class="second_header">Spots nearby</div>
        <div id="map" style="width: 100%;
                            height: 398px;border:1px solid black;margin:0 auto">

        </div>
    </div>

ご覧のとおり、ページは互いに分離されています。
jquery history プラグインのような問題を解決するために、ナビゲーション プラグインが役立つ可能性があるという最後の質問があります。ご協力いただきありがとうございます。

4

1 に答える 1

1

ページを別々のページに分けてください。そうしないと、この種のエラーが発生します。ほとんどの場合、異常なナビゲーション エラーが発生します。それは私が私の経験で経験したことです。

ところで、ここの人々があなたを助けるために、あなたのコードをもっと見せるべきです。

アップデート

PhoneGap と Android の戻るボタンの動作がおかしい。私のアプリケーションで行ったことは、戻るボタンを無効にし、上部ヘッダーにソフトの戻るボタンを指定することです。シンプルhistory.back()は戻るボタンの魔法を行います。

以下のように無効にできます。

$(function(){
    document.addEventListener("deviceready", onDeviceReady, false);
})

// PhoneGap is loaded and it is now safe to call PhoneGap methods
//
function onDeviceReady() {
    // Register the event listener
    document.addEventListener("backbutton", onBackKeyDown, false);
}

// Handle the back button
//
function onBackKeyDown() {
    console.log("Back button pressed but nothing happened");
}

とにかく、これは私のアプローチです。あなたは違うことを選ぶかもしれません。

于 2013-03-05T04:23:00.533 に答える