JQM刪除我的網頁

Question

有一個非常小的例子來展示我的問題與jquerymobile：

JSFiddle - http://jsfiddle.net/forrest_gump/Q73Mk/3/ 

正如你可以看到我叫JQM changePage（），它出現第二個，但它突然被#pageIndex去除

我花了很多時間試圖找出原因！？！我是愚蠢的還是它是一個jqm錯誤？

Answer 1

請注意，pageinit會在頁面準備好顯示但仍然隱藏時觸發，因爲事件的順序仍未在該頁面上發生。更改頁面不會阻止那些事件發生，從而導致目標頁面暫時顯示並恢復到上一頁面。

您有這兩種解決方案：

• 解決方法一：

  延遲changePage使用setTimeout()，以確保所有頁面事件被觸發。

  $(document).on('pagecreate', '#pageIndex', function() { 
      setTimeout(function() { 
       $.mobile.pageContainer.pagecontainer("change", "#pageLogin", { 
        transition: "slideup" 
       }); 
      }, 100); /* 100ms or more */ 
  }); 
  

  注：pageinit已被廢棄，用pagecreate取代。另外，$.mobile.changePage被替換爲$.mobile.pageContainer.pagecontainer("change", "#page", { options });。

  Demo

---

• 解決方法二：

  聽pagebeforechange事件來決定首先顯示的頁面。

  $(document).on("pagebeforechange", function (e, ui) { 
      if (ui.toPage[0].id == "pageIndex" && typeof ui.options.fromPage === "undefined") { 
       $.mobile.pageContainer.pagecontainer("change", "#pageLogin", { 
        transition: "slideup" 
       }); 
       e.preventDefault(); 
      } 
  }); 
  

  Demo