0

jQuery Mobileを使用して、さまざまなhtmlファイルに複数のページがあるWebサイトを作成しています。1つのファイルにこのDIVがあります：

<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回、2回目に2回など、ページにアクセスするたびにデリゲートがもう一度起動されることです。

プロセスは次のとおりです。

ページ1->ページ3（1つのアラート）->ページ1->ページ3（2つのアラート）...にアクセスします。

$('#page3')そのIDを持つ要素がfirebugコンソールで実行されているかどうかを確認しようとしましたが、取得するアイテムは1つだけです。

問題をデバッグするために他に何を確認できるかわかりません。

編集：

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');
         };
   }
 })();
4

1 に答える 1

0

ページは毎回再構築されるため、別のページが検索され、新しいページと古いページでイベントが実行されます。

これを試して：

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

または、に置き換えonてone1回実行します。

于 2012-10-26T07:17:17.320 に答える