初めての jQuery Mobile アプリに取り組んでいます。アプリケーション全体で値が必要な localStorage 値があるため、pageshow イベントを利用してこの値を確認しました。
$(function () {
$("div[data-role='page']").on("pageshow", function (event, ui) {
if (getValue() == null) {
// show the dialog
$.mobile.changePage("#dialog");
}
});
});
これは、さまざまなページをナビゲートするときに機能しますが、最初のページが読み込まれたときに呼び出されることはありません。上記のIf文を、pageshowリスナーを追加する部分の下に再度コピーしようとしましたが、ダイアログを表示して非表示にしてから再度表示するという効果があります。
その最初のページでは、ダイアログを開くと pageshow がトリガーされているように見えます (私のセレクターを考えると、これは奇妙です)。これにより、別のダイアログがトリガーされます。これを回避する方法、または全体を進めるためのより良い方法について誰かアドバイスがありますか?
更新#1:試してみました
$.mobile.changePage( "#mypage", { allowSamePageTransition: true, transition: "none" } );
しかし、ダイアログを起動して非表示にし、再び表示するという元の問題と同じ効果がありました。セレクターでそれを除外しようとしたにもかかわらず、どういうわけかダイアログを起動すると pageshow イベントが発生しているようです。transition: "none"オプションを削除すると、ダイアログはまったく表示されないことに注意してください。
更新 #2:また、空白の最初のページを作成してから、簡単なページ遷移を実行しようとしました
$.mobile.changePage("#mypage");
しかし、それはまだ正しい動作をしていません。このシナリオでは、次のページに移動しますが、ダイアログが表示されないため、pageshow イベントは発生しません。ナビゲーションメニューから別のページを選択でき、ダイアログが表示されるため、起動していないことはわかっています。
更新 #3: pageshow リスナーをアタッチするセレクターを変更しました。where data-role="page" を選択する代わりに、ID で特定のページを選択しています。その後、前回の 2 回の更新で説明した両方のアプローチを再試行しましたが、それでも正しく機能しません。まず、allowSamePageTransition を使用して最初のページを更新しようとすると、ダイアログが 2 回起動するため、pageshow が 2 回起動するように見えます。次に、空白の初期ページを使用してみて、pageshow リスナーをアタッチした直後にリダイレクトを実行すると、何も起こらず、ダイアログが表示されません。他のページに移動すると、ダイアログは期待どおりに機能します。この最初のページがなぜそんなに面倒なのか理解できません。