3

非常に単純なユースケースがあります。

ページの初期化でhtmlをロードします。

 $(document).on('pageinit',function(){
                window.localStorage.setItem("page",'intro_1');                              
                $('#navigation_main').load('html/intro_1.html');

            });

スワイプでdomを変更するだけです。

 var flag = 0;
              $("body").bind("swipeleft",function(event) {
                flag +=1;                               
                page = window.localStorage.getItem("page"); 
                alert(flag);            
                switch(page){
                    case 'intro_1':                         
                        window.localStorage.setItem("page",'intro_2');
                        $('#navigation_main').load('html/intro_2.html');                        
                        break;  

                    case 'intro_2':
                        window.localStorage.setItem("page",'challenges');
                        $('#navigation_main').load('html/challenges.html');                     
                        break;  

                    case 'challenges':
                        window.localStorage.setItem("page",'risk_areas');
                        $('#navigation_main').load('html/risk_areas.html');                     
                        break;

                    default:
                        window.localStorage.setItem("page",'intro_1');                              
                        $('#navigation_main').load('html/intro_1.html');
                        break;  
                }

            });

これで、この左スワイプが2回実行され、後続のページが読み込まれます。どうすればこれを止めることができますか?

4

2 に答える 2

3

$("body").one代わりに、$("body").bind1回だけ呼び出されるようにすることができます。

于 2013-01-15T03:33:24.283 に答える
2

イベントが複数回バインドされていると思いますが、いくつかの方法で解決できます。

  1. $(body).unbind();を使用します。イベントをバインドする前。Unbindは、すでにバインドされているすべてのイベントを削除します。残念ながら、これは適切な防止策ではありません。これは、常にバインド/バインド解除しているため、処理のオーバーヘッドが大きくなるためです。

  2. イベントのバインド/バインド解除、ライブ/ダイ、およびオン/オフを使用する代わりの方法があります。再度バインドする前にバインドを解除する代わりに、jQueryイベントフィルターを使用して、イベントが既にバインドされているかどうかを識別することができます。以下に掲載されているリンクからダウンロードすることを忘れないでください(これはjQMの標準部分ではありません)。

    http://www.codenothing.com/archives/2009/event-filter/

    これは私の使用例です:

    $('#carousel div:Event(!click)').each(function(){
        //If click is not bind to #carousel div do something
    });
    

    私のカルーセルdivには多くの内部ブロックがあるため、それぞれを使用していますが、原理は同じです。#carouselの内部div要素にクリックイベントがない場合は、そのイベントを追加します。あなたの場合、これは複数のイベントのバインドを防ぎます。

于 2013-01-15T11:55:42.740 に答える