0
在我的HTML5/JQueryMobile應用程序，我用幾個數據角色=「頁面」的div在同一index.html文件：頁面jQuery Mobile的應用程序的組織
<body>
<!-- Map page -->
<div data-role="page" data-theme="b" id="map">
<div data-role="header" data-theme="b">
<h1>Map</h1>
</div>
<div data-role="content">
<div id="map_canvas" style="width:320px; height:300px; float:left; border: 1px solid black;">
</div>
</div>
<div data-role="footer" data-position="fixed">
<div data-role="navbar">
<ul>
<li><a href="#map" class="ui-btn-active">Map</a></li>
<li><a href="#list">List</a></li>
<li><a href="#settings">Settings</a></li>
</ul>
</div>
</div>
</div>
<!-- List page -->
<div data-role="page" data-theme="b" id="list">
<div data-role="header" data-theme="b">
<h1>List</h1>
</div>
<div data-role="content">
…
</div>
<div data-role="footer" data-position="fixed">
<div data-role="navbar">
<ul>
<li><a href="#map">Map</a></li>
<li><a href="#list" class="ui-btn-active">List</a></li>
<li><a href="#settings">Settings</a></li>
</ul>
</div>
</div>
<!-- Settings page -->
<div data-role="page" data-theme="b id="settings">
<div data-role="header" data-theme="b">
<h1>Settings</h1>
</div>
<div data-role="content">
...
</div>
<div data-role="footer" data-position="fixed">
<div data-role="navbar">
<ul>
<li><a href="#map">Map</a></li>
<li><a href="#list">List</a></li>
<li><a href="#settings" class="ui-btn-active">Settings</a></li>
</ul>
</div>
</div>
</div>
</body>
此代碼不很很好地工作。點擊幾次後，導航的選定項目不會突出顯示。
這個頁面結構（幾個data-role =「page」在正文中）正確的做法是什麼？
UPDATE
似乎是這樣做（http://jquerymobile.com/demos/1.0a1/#docs/pages/docs-pages.html）的方式，所以我一定會錯過一些東西。
你的HTML無效，在設置頁面的data-theme =「b應該有一個結束報價，並且在頁面底部有一個額外的div – 2011-04-27 16:03:55
@ phill-pafford，對於這個錯字很抱歉。更正的東西。 – Luc 2011-04-27 19:18:14