2012-03-21 9 views
-1

ここで私はお互いにリンクする2つのページを持つ私の単純化されたコードです。その結果、page2カウントアラートには、DOM内に#page2 divが1つ存在すると常に示されます。しかし、page2.htmlが参照されるたびに火災が発生する可能性があります。まず時間が第2の時間は2、などと1です...jQueryMobileのファンキーpagecreate問題

誰かが起こっているとどのようPAGE2のための1つの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 

答えて

0

jQMは、簡単にこの現象が発生見ることができますChromeでデバッガの/ devツールを使用して、同じDOM(ページ)に後続のページをロードします。それはあなたのタグの間に何を引き込むが、他のすべてを無視し、後続のページで

は、あなたや他のページにJSを持っている可能性があり、それはまだだけPAGE2に引くと思います。

ちょうどあなたと何が起こっているかは、最初に#page2にライブイベントを追加するときに#page2を読み込むと、index.htmlに移動しますが、#page2はDOMに残ります。今、あなたは後藤#PAGE2再び、それは再び

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

をあなたのJSを実行するとき、これはもう一度アラートを結合し、2つのイベント火災、次回3が発生します。

あなたがそれを行うことになっている方法は、開始時にすべてのあなたのJSをロードし、pageinit/pageshowのために耳を傾け、私の他の記事を参照してくださいです:https://stackoverflow.com/a/9085014/737023

またはご質問があれば

+0

ここに頼みますはい、これは私が今それをはるかに良く理解するのに役立ちます。私の問題を解決するために、ライブバインディングをpage2.htmlからindex.htmlのヘッダースクリプトに移動しました。これで、alertは1#page2 div要素となり、page2.htmlが参照されるたびに1回ずつ発生します。ありがとう! – emsieja

関連する問題