jQuery Mobile 經典入門教程
來源：互聯網
上載者：User
jQuery Mobile提供了基於手機介面的控制項樣式，可以方便地讓你開發出符合手機操作習慣的介面。比如較大的按鈕等等。使用jQuery Mobile需要應用jQuery Mobile提供的js檔案和css檔案，可以直接url連結引用或者下載到本地引用皆可。參見以下代碼：<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.css" /><script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script><script type="text/javascript" src="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.js"> jQuery Mobile為了使程式更像手機介面，提供了自己程式結構，在HTML的<body>標籤中一個介面可以定義為以下幾個方面<body><div data-role="page"> <div data-role="header">...</div> <div data-role="content">...</div> <div data-role="footer">...</div></div></body>其中page就是放置所有介面的地方，header就是手機程式中經常出現手機介面上面一排的索引欄，content是放置主介面的地方，footer就是放下面程式最小面一排工具列的地方。在靜態介面中使用jQuery Mobile控制項相當簡單，jQuery Mobile提供了一系列的類實現了各種控制項的定義，具體可以查看相關文檔。一般情況下就是定義一個樣式屬性就可以了。比如，定義一個按鈕樣式的超連結，使用下面代碼就可以了：<a href="index.html" data-role="button">Link button</a>如果是想在JavaScript中動態使用jQuery Mobile的一些控制項，比如動態添加一個按鈕是不行的。因為jQuery Mobile的樣式是在頁面load產生的，如果在代碼中產生，jQuery Mobile不會再處理樣式，所以不能顯示出jQuery Mobile的樣式。詳細的內容請見：http://jquerymobile.com/demos/1.0b1/
