6

インデックスページには非常に単純なユースケースがあります。

        <script src="js/jquery-min.js"></script>
        <script src="js/jquery-mobile.js"></script>
        <script type="text/javascript" src="cordova-2.2.0.js"></script>

         <script>
                 $("body").on("swipeleft", function(event) {
                alert('hello');
                /*window.location.href = "html/first.html";*/             
            });
       </script>

何らかの理由で、このイベントは2回発生しています。これは最初のページであるため、bodyタグで別のイベントをバインドしていないと確信しています。タッチスタートなどの他の簡単なイベントを試しました。それらはすべて2回起動しています。私は何を間違っているのですか？

アップデート ：-

正解とマークした回答を次のように変更しましたが、機能しました。このページのイベントは2回発生していません。

<head>
      <script type="text/javascript" src="js/jquery-min.js"></script>
            <script>
                 $(document).bind("mobileinit", function() {
                       $.mobile.autoInitializePage = false;
                       $.mobile.defaultPageTransition = 'none';
                       $.mobile.touchOverflowEnabled = false;
                       $.mobile.defaultDialogTransition = 'none';
                       $.mobile.loadingMessage = '' ;                 
                  });
            </script>
            <script type="text/javascript" src="js/jquery-mobile.js"></script>
            <script type="text/javascript" src="cordova-2.2.0.js"></script>
</head>
4

3 に答える 3

14

この問題を回避する方法はいくつかあります。CodeJackが言ったように、これは既知の問題ですが、主にjQM独自のページ処理方法のため、エラーではありません。

  • 最も簡単な方法は、次のように、イベントを再度バインドする前に、イベントのバインドを解除することです。

    $("body").off().on("swipeleft", function(event) {
    alert('hello');
    /*window.location.href = "html/first.html";*/             
});

    同じオブジェクトにバインドされた他のイベントがある場合は、これを使用します。

    $("body").off("swipeleft").on("swipeleft", function(event) {
    alert('hello');
    /*window.location.href = "html/first.html";*/             
});

  • イベントのバインド/バインド解除、ライブ/ダイ、およびオン/オフを使用する代わりの方法があります。再度バインドする前にバインドを解除する代わりに、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-19T07:45:27.677 に答える
4

ドキュメントレディイベントを使用して、イベントを本文に添付してみてください。また、イベントを1回だけ本体に添付することもできます。

$(document).ready(function(){
    $("body").off().on("swipeleft", function(event) {
        alert('hello');          
    });
});

同じオブジェクトにバインドされた他のイベントがある場合は、これを使用します。

$(document).ready(function(){
    $("body").off("swipeleft").on("swipeleft", function(event) {
        alert('hello');          
    });
});
于 2013-01-19T07:51:16.490 に答える
1

これは既知の問題です...jsコードをタグ内に移動することで回避できることがわかりまし<head>た..理由はわかりません..しかし、それで問題は回避されました...

于 2013-01-19T05:50:13.883 に答える