2012-10-25 63 views
0

我使用jQuery Mobile在不同的html文件中創建一個包含多個頁面的網站。在一個文件中我有這樣的DIV:JQuery Mobile執行多次委託

<div data-role="page" id="page3" style="overflow-x: hidden !important;"> 
<div data-role="content">... 
</div> 
</div> 

我已經在第一頁的標題中定義的委託爲:

$(document).delegate('[id="page3"]', 'pageshow', function() { 
    alert('page3'); 
}; 

的問題是,這個委託是一旦頁面第一次發射被加載,第二次兩次,等等......每次你訪問頁面時,代表被再次啓動一次。

的過程是這樣的:

參觀第1頁 - >第3頁(一個警報) - >第1頁 - > 3(兩個警報)頁....

我已經試過檢查是否有與該ID Firebug控制檯上執行$('#page3')一個以上的元素,我只得到一個項目。

我不知道還有什麼我可以檢查調試問題。

編輯:

page1.html

<html> 
    <head> 
     <script type="text/javascript" src="assets/js/delegation.js"></script> 
     <script type="text/javascript"> 
      delegation.delegate3() 
     </script> 
    </head> 
    <body> .... 

page3.html

<html> 
    <head> 
     <script type="text/javascript" src="assets/js/delegation.js"></script>  
    </head> 
    <body> 
     <div data-role="page" id="page3" style="overflow-x: hidden !important;"> 
      <div data-role="content">... 
      </div> 
     </div>.... 

delegation.js

var delegation = (function() { 
    return { 
    delegate3:function delegate3() { 
    $(document).delegate('[id="page3"]', 'pageshow', function() { 
      alert('page3'); 
     }; 
    } 
})(); 
+0

您可以包括你在哪裏寫我已經提供了與代表互動,如果你認爲問題出在我的代碼可以包括更多的代碼的其他部分代碼的一部分這一事件 –

+0

塊。謝謝! – pablobart

+0

委託事件處理程序應該在'data-role =「page」'元素之外運行。如果您將代碼放置在「data-role =」頁面「'元素中,那麼每次將該頁面添加到DOM時(即每次顯示時)都會執行該代碼。 – Jasper

回答

0

你的頁面都是R ebuild,所以它會找到另一個頁面並在新舊頁面上執行該事件。

試試這個:

$(document).on("pageshow", "#page3", function() { 
    alert('page3'); 
}; 

one更換on執行一次;

+0

'one'解決了問題,'on'與'delegate'有同樣的問題。謝謝! – pablobart