移動設備的後退按鈕jQuery Mobile的錯誤頁面沒有風格

Question

，我用的是回設備按鈕顯示前一頁這是工作與除一個頁面中的所有頁面，顯示了不當試圖到達前面的頁面時有一個樣式化的頁面，所以出現了Odd。
這裏有一個簡短的解釋。 當我進入#second_map頁面時，有3頁#main_menu，#first_map，#second_map 當我按下返回按鈕 但實際上它顯示#main_menu頁面沒有css樣式時，它應該轉到#first_page。 你能告訴我什麼是問題，我們如何解決它，提前謝謝你。 我提供的源代碼： 這是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 --> 

最後第二張地圖位置：

 <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歷史插件這樣的問題，並感謝您的幫助。

Answer 1

確保有不同的單獨頁面的網頁。如果不會發生這種類型的錯誤。大多數情況下，你會遇到異常的導航錯誤。這就是我的經驗。

BTW，你應該表現出更多的代碼爲這裏的人來幫助你。

更新

的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"); 
} 

無論如何這是我的方法。你可以選擇與衆不同。