のドロップダウンメニューには、私はJQMのWebアプリケーションを作成し、以下の効果JQueryMobile：ヘッダー
----------------------------------
[Menu1] Page Title [Menu2]
----------------------------------
JQMのドロップダウン・ウィジェットの任意の例を達成するためにヘッダにあるドロップダウンメニューを追加する必要があるのですか？
ここで私は、このために書いたコードでjsFiddleです。
このjsFiddleを参照するには、jQuery Mobileの組み込みセレクトメニューに基づくサンプルが必要です。私は過去にこのようなことをしなければなりませんでした。完璧ではなく、すべてのデバイスで正しくレンダリングされないかもしれませんが、私の場合はうまくいきました。
主な理由選択コントロールを使用できないのは、メニュー名の静的ラベルを維持する必要があることです。選択コントロール。ボタンのテキストは現在選択されているオプションに更新され続けます。 –
それをあなたの質問に追加して、他の人がそれを考慮に入れられるようにしてください。ドロップダウンに表示されるテキストが実際には変更されないように、selectアクションをjQueryでオーバーライドすることもできます。 – Ryan
jQueryのモバイル1.2ドキュメントは、ボタンからメニューを作成するのではなく、選択するためのポップアップ・ウィジェットの使用例を与える：
jQueryのモバイル1.3http://jquerymobile.com/branches/popup-widget/docs/pages/popup/index.html
<a href="#popupMenu" data-rel="popup" data-role="button" data-inline="true" data-transition="fade">Menu</a>
<div data-role="popup" id="popupMenu" data-overlay-theme="b">
<ul data-role="listview" data-inset="true" style="width:180px;" data-theme="b">
<li><a data-rel="popup" href="#popupMenuLevel1">Add</a></li>
<li><a data-rel="popup" href="#popupMenuLevel1">Edit</a></li>
<li><a data-rel="popup" href="#popupMenuLevel1">Manage</a></li>
<li><a data-rel="popup" href="#popupMenuLevel1">Delete</a></li>
</ul>
</div>
<div data-role="popup" id="popupMenuLevel1" data-overlay-theme="b">
<ul data-role="listview" data-inset="true" style="width:180px;" data-theme="b">
<li><a data-rel="popup" href="#popupMenuLevel2">Remove</a></li>
<li><a data-rel="popup" href="#popupMenuLevel2">Undo</a></li>
<li><a data-rel="popup" href="#popupMenuLevel2">Splice</a></li>
<li><a data-rel="popup" href="#popupMenuLevel2">Reticulate</a></li>
</ul>
</div>
<div data-role="popup" id="popupMenuLevel2" data-overlay-theme="b">
<ul data-role="listview" data-inset="true" style="width:180px;" data-theme="b">
<li><a href="index.html">Basics</a></li>
<li><a href="options.html">Options</a></li>
<li><a href="methods.html">Methods</a></li>
<li><a href="events.html">Events</a></li>
</ul>
</div>
これはブランチです。これはjqueryモバイルリリースには含まれていません。上記のいずれかを使用しようとすると、popup-widgetブランチからjqueryおよびjqueryモバイルjavascriptライブラリが必要になります。 – Mervyn
@Mervynありがとう、なぜこれがブランチであることがドキュメントに記載されていないのだろうか？ – Bula
これは今リリースされた1.2で動作します。ちょうどそれを試した。ブランチは必要ありません。上記のコメントはもはや意味のないものです。 – scottheckel
この問題のサンプルが組み込まれています。
http://view.jquerymobile.com/1.3.0/docs/widgets/popup/
<a href="#popupMenu" data-rel="popup" data-role="button" data-inline="true" data-transition="slidedown" data-icon="gear" data-theme="e">Actions...</a>
<div data-role="popup" id="popupMenu" data-theme="d">
<ul data-role="listview" data-inset="true" style="min-width:210px;" data-theme="d">
<li data-role="divider" data-theme="e">Choose an action</li>
<li><a href="#">View details</a></li>
<li><a href="#">Edit</a></li>
<li><a href="#">Disable</a></li>
<li><a href="#">Delete</a></li>
</ul>
</div>
あなたは、ヘッダーバーに例えば5つのボタンとナビゲーションバーグリッドメニューを設定し、ナビゲーションバーのボタン、ドロップダウン・トランザクションの独立と1つのポップアップメニューごとに設定する必要があります。
は1.7.1でこれを試してみましたが、うまくいきません...書式設定はまったく一緒ではありません...ドロイド（LGスリル）上に表示していました。 – ppetree
ギャラクシーS CM9の在庫ブラウザとChromeの両方で問題なく動作します。 –