2

この jQuery Mobile (バージョン 1.1.0) の質問をご覧いただきありがとうございます。

私の最初の質問は次のとおりです。すべてのページ読み込みとすべての ajax ページ呼び出しで実行するためにどの関数を使用しますか (それらは 2 つの別個の獣のようです)。毎回実行してもらいたいです。

$(document).bind('pageinit',function(){
    console.log('Does this work for you?');
});

さまざまな機能のために jQuery コードを使用して、いくつかの分離された jQuery-Mobile を利用した HTML ページがあります。この機能の一部には、いくつかのページで発生するタッチベースのスライダー (royalSlider) が含まれています。一部のコードは、特定の要素 (固定のサブヘッダーやフッターなど) が存在するかどうかを調べて、ページの余白を調整し、メイン コンテンツが遮られるようにします。その他の js は、すべての画像に対して AJAX 呼び出しをトリガーする特定のクラスですべての要素をヒットするスクリプトです。

質問: すべてのページの ID ごとに呼び出されるライブ pageinit 関数が必要ですか? すべてのページで pageinit AND pagecreate を使用する必要がありますか?

たとえば、フッターがあるかどうかを検出する face() という関数があるとします。これにより、クラスを .container に追加して下部マージンを追加し、メイン コンテンツが見えないようにすることができます。

理論的には、ページに着陸したり、AJAX を介してページをプルしたりすると、すべてのアクティブなページにヒットするこのような関数を実行できませんか?

$('[data-role="page"].ui-page-active').live('pageinit', function(){ 
    face();
});

いいえ:

$("#brand-grid,#product-grid,#main-grid,#trends").live('pageinit', function() {
    face();
});

私が見つけたのは、最初にオフセットが必要なページに着陸したときに機能することですが、別のページに移動すると機能しなくなります。これは、DOM に 2 つの div[data-role="page"] があり、コマンドがあいまいすぎるためですか? それとも、pageinit が元のページでのみ機能し、AJAX のコンテンツでは機能しないためですか?

次の質問: ページから移動した後、ページを破棄するにはどうすればよいですか? できれば、タブレットで RoyalSlider の 2 つのインスタンスを実行したくありません。

これが私の試みです:

$('[data-role="page"].ui-page-active').live('pageinit', function(){
     $('[data-role="page"]:not(.ui-page-active)').live('pageremove');
});

メモリリークとパフォーマンスの低下を避けたいだけです。JQM は、これらの気まぐれな問題を除けば、開発するのに非常に優れています。ありがとうございました。

4

3 に答える 3

2

質問 1 への回答:

私はあなたと同じ問題を抱えていたと思います。これを解決した方法は次のとおりです。イベントのターゲットは新しいページの div (つまり、data-role="page の div) であるため、pageinit ハンドラーに event パラメーターを含める必要があります")、そのため、そのページの DOM 要素をターゲットにするために使用する任意の jQuery セレクターで、ターゲットをコンテキストとして使用できます。たとえば、次のようになります。

$(document).on('pageinit', function(event) {
  $('#some-element', event.target).toggle();
});

質問 2 への回答:

pageremove のハンドラーでも同じことができると思います。

于 2012-07-01T05:38:30.757 に答える
2

ajax を使用してページが読み込まれるたびに関数を実行する場合

$(document).bind('pageinit')

http://jquerymobile.com/test/docs/api/events.html

ページを削除するために同様のことができると思います

$(document).bind('pageremove')
于 2012-04-26T15:26:16.687 に答える
1

jquery モバイルでは、異なるページで ID を重複させることはできません。ページがドキュメントに追加されるため、要素が異なるページにある場合でも、ID は異なる必要があります。ここでより多くの(そしてより良い)説明:

https://forum.jquery.com/topic/pageinit-firing-twice#14737000002873163

于 2012-05-16T08:43:46.550 に答える