ダイアログとして使用される動的ページを生成する 2 つのメイン ページ (ログイン ページとマップ ページ) を持つアプリケーションがあります。そのほとんどはサブページを持ち、チェーン ダイアログ構造になっています。
したがって、完全に通常の行動方針は次のようになります。
ログイン -> マップ -> ダイアログ -> サブダイアログ
最初は、次のようなインターフェイスのボタンを使用して、Map から Dialog に移動していました。
<a href="#dialogID" data-icon="arrow-r" data-iconpos="right" data-rel="dialog" data-role="button" data-theme="b" class="ui-btn-right">Info</a>
このシステムを使用すると、ダイアログの [閉じる] ボタンまたはブラウザの [戻る] ボタンを使用して、ログインからサブダイアログに移動し、再び戻ることができます。アドレス バーは次のように更新されます。
Login Page: http://serverName/
Maps Page: http://serverName/#page-map
Dialog: http://serverName/#page-map&ui-state=dialog
Sub-Dialog: http://serverName/#page-map&ui-state=dialog&ui-state=dialog
これは完全に正常な動作であり、data-rel="dialog" のリンクをたどっている限り問題なく動作します。
しかし、Google マップのマーカー オブジェクトをクリックすると、ダイアログが直接開くように、サイトの動作を変更したかったのです。私はこれを次のように行います：
$.mobile.changePage($("#dialogID"), { role: "dialog" });
これを行うと、[戻る] に移動するか、サブダイアログの [閉じる] ボタンをクリックすると、ログイン ページの表示に戻ります。ただし、URL は Dialog 状態の URL です。URL は正しいのですが、画面に表示される内容が間違っています。
そのため、通常は ABCD->DCBA に移動できるのではなく、ABCD->DA に移動し、途中の 2 ページをスキップします。
これは jQueryMobile のバグですか? または、changePage を間違って使用していますか?
編集:これは、動作を示す詳細な JSFiddle です: http://jsfiddle.net/LxFJq/14/ 動的ページのために表示されるようです。それらが静的ページ ( http://jsfiddle.net/hgb7s/2/ ) の場合、すべて期待どおりに機能します。動的ページはナビゲーションを中断しますが、イベント ハンドラーからクリックするというエッジ ケースのみです。少なくとも私はそれを絞り込みました。
解決済み:私は自分で問題を解決しました。
<a data-rel="dialog"> タグは、新しいページに data-url 属性を自動的に追加します。changePage() 関数はそうしません。だから私はそれらを自分で追加しました、そしてすべてがうまくいきます。http://jsfiddle.net/LxFJq/15/の data-rel 属性を使用した作業結果
これからの最初の2つのコメントに基づいて、この情報を見つけました: https://gist.github.com/1037934