與jQueryMobile時髦pagecreate問題

-1

這是我的簡化代碼，其中有兩個頁面鏈接到對方。結果是page2 count警報總是說在DOM中有一個＃page2 div。但是，每當page2.html被引用時，pagecreate就會觸發。第一次是1，第二次是2，依此類推...與jQueryMobile時髦pagecreate問題

有人可以解釋發生了什麼以及如何獲得頁面2的一個pagecreate事件嗎？

index.html 

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> 
    <link rel="stylesheet" href="jquery.mobile-1.0.1.min.css" /> 
    <script src="jquery-1.6.4.min.js"></script> 
    <script src="jquery.mobile-1.0.1.min.js"></script> 
</head> 
<body> 
    <div data-role="page"> 
     <div data-role="content"> 
      <h3>In Index Page</h3> 
      <a href="page2.html" data-role="button">Go To Page2</a> 
     </div> 
    </div> 
</body> 
</html> 


page2.html 

<!DOCTYPE html> 
<html> 
<head> 
</head> 
<body> 
    <div id="page2" data-role="page"> 
     <div data-role="content"> 
      <a href="index.html" data-role="button">Back</a> 
     </div> 
     <script type="text/javascript"> 
      alert("page2 count is " + $("#page2").length); 
      $("#page2").live('pagecreate',function(event, ui) { 
       alert("in page2 on pagecreate"); 
      }); 
     </script> 
    </div> 
</body> 
</html> 

Thanks, 
-- Ed

來源

2012-03-21 emsieja

JQM載入後續頁面到使用Chrome存在的調試器/開發工具，你可以很容易地看到這種情況發生在同一DOM（頁）。

在隨後的頁面中，它會在你的標籤之間插入任何東西，但忽略其他所有內容，你可以在你的或其他頁面上放置JS，它仍然只能拉入page2。

你到底發生了什麼事情是，當你第一次加載＃page2它正確地將一個活動事件添加到＃page2，然後你導航到index.html，但＃page2仍然在你的DOM。現在，當你轉到＃第2頁再次，它將運行您的JS再次

$("#page2").live('pagecreate',function(event, ui) { 
     alert("in page2 on pagecreate"); 
});

這又結合您的警報，以及2個事件觸發，下一次3會火。

你應該做的是在開始裝載所有的JS和監聽pageinit/pageshow，看到我的其他職位的方式：https://stackoverflow.com/a/9085014/737023

或者，如果你有任何問題，請在這裏

來源

2012-03-21 16:38:05

是的，這有助於我現在理解它好得多。爲了解決我的問題，我簡單地將實時綁定移出page2.html並將其移入index.html中的頭文件腳本中 - 現在，警報提示1＃page2 div元素和pagecreate每次引用page2.html時觸發一次。謝謝！ – emsieja 2012-03-21 17:15:18

與jQueryMobile時髦pagecreate問題

回答

相關問題