changePage が呼び出されたときに jQuery Mobile が読み込みスピナーを非表示にするのを止めようとしています。
プログラム フローは、次のように定義されたクリック イベントを持つリンクをクリックすることから始まります。
$('body').delegate('.library-link', 'click', function() {
$.mobile.loading( 'show' );
$.mobile.changePage($('#page-library'));
return false;
});
リンクをクリックすると、pagebeforeshow
イベントが発生し、関数がトリガーされてローカル ストレージからページにデータが入力されるか、データを取得するために ajax 呼び出しが行われます。
$(document).on('pagebeforeshow', '#page-library', function(event){
ui.populate_data();
});
ではui.populate_data()
、ローカル ストレージからデータを取得するか、ajax 呼び出しを行います。
ui.populate_data = function() {
if (localdata) {
// populate some ui on the page
$.mobile.loading( 'hide' );
} else {
// make an ajax call
}
};
データがそこにある場合は、データをコンテナにロードし、ロード スピナーを非表示にします。そうでない場合は ajax 呼び出しを行い、完了時にデータをローカル ストレージに保存して呼び出します。ui.populate_data()
問題は、イベントが終了した後、データがまだそこにない可能性があるにもかかわらずpagebeforeshow
、changePage が呼び出していることです。$.mobile.loading( 'hide' )
を一時的に再定義する以外に、 changePage がスピナーを非表示にするのを防ぐ方法が見つかりません$.mobile.loading
。これはかなり間違っているように感じます。
$('body').delegate('.library-link', 'click', function() {
$.mobile.loading( 'show' );
loading_fn = $.mobile.loading;
$.mobile.loading = function() { return; };
$.mobile.changePage($('#page-library'), {showLoadMsg: false});
return false;
});
私のUI関数でスピナーを非表示にする前に:
ui.populate_data = function() {
if (localdata) {
// populate some ui on the page
if (typeof loading_fn === 'function') {
$.mobile.loading = loading_fn;
}
$.mobile.loading( 'hide' );
} else {
// make an ajax call
}
};
確かに、読み込み中のウィジェットの表示と非表示を完全に制御する方法があるはずですが、見つかりません。私は{showLoadMsg: false}
changePageに渡そうとしましたが、ドキュメントで示唆されているように、私が行っていないajax経由でページをロードするときにのみ機能します。