這個是直接從JQuery Mobile網站獲取的:
http://jquerymobile.com/about/
“jQuery Mobile是一個基於HTML5的用戶界面系統,旨在製作可在所有智能手機,平板電腦和桌面設備上訪問的響應式網站和應用程序。它基於堅如磐石的jQuery和jQuery UI基礎,並提供Ajax導航頁面過渡,觸摸事件和各種小部件。它的輕量級代碼採用漸進增強功能構建,並具有靈活,易於設計的主題設計。“ - JQuery Mobile團隊
我強烈建議您訪問該網站以了解有關JQuery Mobile的更多信息。這只是幫助初學者的摘錄。
您還可以在jquery-mobile官方網頁上找到更多示例和信息: https : //jquerymobile.com/demos
當前版本的JQuery Mobile是1.4.5,可以在這裡下載: https : //jquerymobile.com/
在下面的代碼中,URL包含javascript和css文件。您也可以按照上面的要點進行操作,並按照它在本地計算機上的路徑包含它,即:
<link href="lib/jqm/jquery.mobile-1.4.5.min.css" rel="stylesheet" />
...
<script type="text/javascript" src="lib/jqm/jquery.mobile-1.4.5.min.js"></script>
這些是css和js文件的縮小版本。您也可以在開發過程中包含非縮小版本,以便在需要深入了解時更容易閱讀。如果您這樣做,我建議在部署到生產時將它們切換回縮小版本。
<!-- it is imported inside head tags. -->
<!-- no additional files needed, if css and js referred with full path. -->
<!DOCTYPE html>
<html>
<head>
<!-- Viewport setup. -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- jQuery Mobile styles come first before js. -->
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<!-- Basic jQuery library -->
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<!-- jQuery Mobile library kind of extends upon jQuery -->
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</head>
<body>
<!-- example page element using jQuery mobile tags: -->
<div data-role="page" id="pageone">
<div data-role="header" id="pageone-header">
<h3>Insert Page header Here</h3>
</div><!-- /header -->
<div role="main" class="ui-content" id="pageone-content">
<center><h3>Page title</h3></center>
<!-- All HTML for the page content goes here -->
</div><!-- /content -->
<div data-role="footer" data-position="fixed">
<h4>Insert Page footer Here</h4>
</div><!-- /footer -->
</div>
</body>
</html>