要使用jquery mobile必須要有符合的html定義,在jquery mobile初始化時,它會將頁面上相關的tag和attribute,轉成對應的樣式。以下是一個基本的page結構:
<div data-role="page"> <div data-role="header"> <h1>Page Title</h1> </div> <!-- /header --> <div data-role="content"> <p>Page content goes here.</p> </div> <!-- /content --> <div data-role="footer"> <h4>Page Footer</h4> </div> <!-- /footer --> </div> <!-- /page -->
<!-- 跳到id是page2的頁面(利用錨點的特性) --> <a href="#page2" data-rel="dialog">Open dialog</a> <!-- 發ajax取得頁面 --> <a href="index.html" data-rel="dialog">Open dialog</a>
<a href="index.html" data-transition="pop">I'll pop</a>
// var html = "<a href='index.html' data-role='button'>Link button</a>"; $("#content").append(html) .page();