0

私はjQuerymobileで多くの問題を抱えており、本当に頭を悩ませたいと思っています。

このコードのページがあります:

$(document).on('pageinit ',function(){
$("#phone_number").on("blur", function (event, ui) {


    $.mobile.changePage("<?php echo base_url(); ?>mobile/products_by_phone",  {
     type: "POST",
     data: {phone :  $('#phone_number').val() },
    transition: "flip"} );

});
});

これで、ページに次のコードを含むjQuerymobileの有効なhtmlとマークアップが含まれます。

$(document).on('pageinit ',function(){
 alert();
 });

これで、ページを変更すると機能しますが、イベントを再度呼び出すblurと、ページが2回変更され、もう一度4回、次に8回というように変更されます。

ブラウザの戻るボタンを押しても機能しますが、前に押しても何も起こりません

ノート:

  • おそらくそれはぼかしに関連していると思い、changePageが発生するたびにぼかしが発生するので、ボタンを追加してクリックにバインドしようとしましたが、同じことが起こります
  • バインドすると原因になるのではないかと思ったdocumentので、ページIDにバインドしようとしましたが、まったく機能しませんでした(イベントがバインドされていないため何も起こりません)。次に、作成イベントをトリガーしようとしましたが、それもイベントをバインドしませんでした

なぜこれが起こるのですか?

4

3 に答える 3

1

あなたがしなければならないのは、init イベントをバインドしたいページを追加することだけです...これを一度バインドしたいと仮定すると、より具体的にする必要があります。

例:

$(document).on('pageinit', '#page1', function(e){...});

#page1 をページ ID に置き換えます。

于 2013-01-02T21:22:30.007 に答える
0

これは jQuery モバイルでよくある問題です。複数のイベントが同じ要素にバインドされていることが原因です。前のページに戻るたびに、同じイベントを再度バインドします。

この問題には 2 つの解決策があります。

イベントを要素にバインドする前に、同じイベントがまだバインドされていないかどうかを確認してください。

例:

$('.menu-browse:Event(!' + touchEvent + ')').each(function(){
    $('.menu-browse').bind(touchEvent, function(e) {

    });
});

ここでは、イベント フィルターの完全な実装を確認できます: http://www.codenothing.com/archives/2009/event-filter/

または:

イベントをバインドするたびに、バインドを解除してください。

例:

$(document).unbind();
$(document).bind('pageinit', function(e) {

});

また:

$(document).die();
$(document).live('pageinit', function(e) {

});

またはあなたの場合:

$(document).off(); 
$(document).on('pageinit',function(){
    alert();
});

残念ながら、この問題に対する完全な解決策はありません。

于 2013-01-02T16:08:54.433 に答える
0

私は jQuery モバイルに詳しくありませんが、changePage()関数が AJAX 呼び出しを使用して新しいページ コンテンツをロードすると想定しています。その場合、既存のイベント ハンドラーはそのまま残り、単純に毎回追加することになります。

.off()(再) バインドする前に、関数を使用してイベント ハンドラーを削除してみてください。

于 2013-01-02T16:03:59.880 に答える