1

jQuery Mobile + backbone.js を使用して、1 ページのアプリを構築しています。

Backbone.js はルーティングとテンプレートの処理に使用され (実際には underscore.js が処理します)、jQuery モバイルはスタイルの提供と一部のモバイル イベント (pageshow、pagebeforeshow など) のサポートに使用されます。

アプリケーションは完全にオフラインで動作し、タブレット モバイル デバイスでの使用を想定しています。(Android 2.3 以降)

要素をクリックすると、関連するリソースを取得するために backbone.js ルーターを使用します (例: /product/:id は、指定された ID を持つ製品に関するデータを表示する必要があることを意味します)。データをテンプレートに送信して html を生成し、DOM を変更してビューを更新します。

モバイル デバイスでアプリを実行すると、要素をクリックしてから実際に新しい状態がページに反映されるまでにわずかな遅延が生じます。それはひどい問題ではありませんが、ユーザーにフィードバックを提供する必要があるため、ビューステートを変更する前に、ユーザーがいくつかの要素をクリックするたびに「ページの読み込み」インジケーターを表示しようとしています. そんな時、壁にぶち当たります…

問題 関連する「クリック」要素のイベント ハンドラーを登録すると、イベント ハンドラー コードの終了後、クリック ハンドラーの既定のアクションが実行され、ビューが再描画されないため、ページの読み込みが表示されません。setTimeout を使用してもどちらも役に立ちません。その場合、計算が開始され、インジケーターが終了した後、つまりページが実際に新しい状態になったときにインジケーターが表示されるため、インジケーターは表示されないか、少し前に表示されるだけです。解任される。

私ができるほとんどすべての解決策を試しました：

  • クリック/マウスダウン/タップダウンイベントにインジケーターを表示します->これを試しましたが、何らかの理由でクリックイベントがトリガーされない場合があります

ルーティングは正常に機能しますが、次のようなコードを追加した瞬間:

 $(document).bind('click', function(element) {
    $.mobile.showPageLoadingMsg();
  });

その後、クリック イベントのドロップが開始されます。読み込みインジケータが表示されますが、ルーティングも行われます。そのコードを使用しない場合、すべて正常に動作します。

  • 「fastclick」コード (https://github.com/cargomedia/jquery.touchToClick) を使用してクリック イベントをインターセプトし、インジケーターを表示してから、要素内のクリック イベントを手動でトリガーします。表示されません:(

何か案は？私は何かが欠けているに違いない:(

4

0 に答える 0