JQueryMobile：メニューのLIから開いたときにページとしてスタイル設定されたダイアログ

Question

私が作成したドロップダウンメニューでダイアログボックス（data-rel = "dialog"）をリンクしようとしています。しかしながら; JQMは全ページビュー（data-role = "page"）で開いています。

同じページのボタンまたはリストビューから開いたときに同じダイアログが適切なダイアログ（data-role = "dialog"）として表示されます。

ボタンから最初にダイアログを起動すると、その後、メニュー項目からダイアログを起動しようとすると、ダイアログボックスとして表示されます。しかし、メニュー項目から最初にダイアログを起動すると、ページとしてレンダリングされます。リストビューでメニュー項目で

リンク（ページとしてダイアログが開きます）

<ul data-role="listview" data-inset="true"> 
    <li data-icon="false"> 
     <a href="#showDialog" data-rel="dialog">Show Dialog</a> 
    </li> 
</ul> 

ボタンでリンク（ダイアログとしてダイアログが開きます）

<a href="#showDialog" data-role="button" data-rel="dialog">Show Dialog</a> 

リンク（ようダイアログが表示されますダイアログ）

<ul data-role="listview" data-inset="true"> 
    <li><a href="#showDialog" data-rel="dialog">Show Dialog</a></li> 
</ul> 

このデモはjsFiddleです。

2つの質問：

1）なぜこの動作の違いがありますか？

2）ダイアログをメニュー項目からダイアログとして開くにはどうすればよいですか？ （代わりに「ページ」の）データ・役割=「ダイアログ」が常にダイアログボックスとしてレンダリングすることを強制してdiv要素をマーキング

：

Answer 1

は、私のクエリの第二の部分への答えを考え出しました。

<div data-role="dialog" id="showDialog"> 

なぜこの動作の違いがわかるのでしょうか。