觸發輔助頁面加載的任意方法

我正在構建一個簡單的應用程序，該應用程序在第一頁上加載數據列表，然後讓用戶深入瞭解第二頁上的項目的詳細信息。這兩個頁面都有AJAX調用，從服務器檢索數據並顯示它。我想在加載時在第二頁上執行數據檢索（無論是作爲輔助頁面還是主要頁面）。不過，我已經嘗試了jQuery Mobile 1.4.3文檔中列出的每一種方法，但都沒有工作。觸發輔助頁面加載的任意方法

要明確的是，當repo.html本身加載時，它可以正常工作，但是當它作爲輔助頁面加載（點擊/點擊事件之後）時，沒有任何指定的事件可以工作。事實上，我已經將每個相關事件寫入演示頁面進行測試。

<!-- repo.html --> 
<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no"> 
    <title>Chapter 5 - Repos</title> 
    <link rel="stylesheet" href="css/jquery.mobile-1.4.3.css" /> 
    <script src="js/jquery-1.10.2.js"></script> 
    <script src="js/jquery.mobile-1.4.3.js"></script> 
</head> 

<body> 

    <div id="home_page" data-role="page"> 
     <div data-role="header"><h1>Popular Repos</h1></div> 
     <div data-role="content"> 
      <ul id="results" data-role="listview" data-dividertheme="b"> 
      </ul> 
     </div> 
    </div> 

    <script type="text/javascript"> 
     $(document).on("hashchange", function(event){console.log(event)}); 
     $(document).on("mobileinit", function(event){console.log(event)}); 
     $(document).on("navigate", function(event){console.log(event)}); 
     $(document).on("pagebeforechange", function(event){console.log(event)}); 
     $(document).on("pagebeforecreate", function(event){console.log(event)}); 
     $(document).on("pagebeforehide", function(event){console.log(event)}); 
     $(document).on("pagebeforeload", function(event){console.log(event)}); 
     $(document).on("pagebeforeshow", function(event){console.log(event)}); 
     $(document).on("pagechange", function(event){console.log(event)}); 
     $(document).on("pagechangefailed", function(event){console.log(event)}); 
     $(document).on("pagechangefailed", function(event){console.log(event)}); 
     $(document).on("pagehide", function(event){console.log(event)}); 
     $(document).on("pageinit", function(event){console.log(event)}); 
     $(document).on("pageload", function(event){console.log(event)}); 
     $(document).on("pageremove", function(event){console.log(event)}); 
     $(document).on("pageshow", function(event){console.log(event)}); 
    </script> 

</body> 
</html>

當此頁面作爲輔助頁面加載時，上述任何事件都不會觸發。他們都沒有。當頁面重新加載，下面的事件觸發，依次是：

jQuery.Event {type: "pagebeforechange", } 
jQuery.Event {type: "pagebeforechange", } 
jQuery.Event {type: "pagebeforecreate", } 
jQuery.Event {type: "pageinit", } 
jQuery.Event {type: "pagebeforeshow", } 
jQuery.Event {type: "pageshow", } 
jQuery.Event {type: "pagechange", }

有什麼我失蹤日期

來源

2014-08-31 commadelimited

你有兩個選擇，將js放在首頁的頭部，或將它們放在第二頁的頁面div中。 http://stackoverflow.com/a/21761039/1771795 – Omar 2014-08-31 06:13:31

，如果你想讓它僅出現一次只需使用文件準備好了嗎？將腳本放在每個頁面的頭部。請參閱http://jsbin.com/ofuhaw/1538.html

jQuery mobile只會在初始頁面加載時在頭部執行腳本。在ajax負載期間，它們將被完全忽略。它需要在頁面2當前處於刷新狀態的每一頁上。

如果你想避免發送腳本的Ajax請求（即使它被忽略），以避免傳輸額外的字節可以檢查HTTP_X_REQUESTED_WITH頭，如果它等於xmlhttprequest不發送腳本標籤，因爲這意味着它的一個ajax請求。你可以看到這個使用PHP的演示http://demos.jquerymobile.com/1.4.3/toolbar-fixed-persistent-optimized/

來源

2014-08-31 19:18:53 user2665795

很高興見到你身邊的亞歷克斯。 – Omar 2014-08-31 20:24:17

所以你推薦在_single頁面model_中使用'.ready'？ JQM文檔建議使用'pageinit' /'pagecreate'來綁定事件，因爲它們每頁發送一次。 – Omar 2014-08-31 20:34:14

@Omar他們是爲了不同的事情'pagecreate'每次創建頁面時都會觸發，這正是OP不想要的內容。他想在第一頁加載時只觸發一次。不管哪一頁可能。 – user2665795 2014-08-31 20:44:41

觸發輔助頁面加載的任意方法

回答

相關問題