<!DOCTYPE html>
<html>
<head>
<title>jQuery Mobile: Pages within Pages</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.css" />
<script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"></script>
</head>
<body>
<div data-role="page" id="home">
<div data-role="header"><h1>Home</h1></div>
<div data-role="content"><p><a href="#about" data-transition="flip">About this app</a></p></div>
</div>
<div data-role="page" id="about">
<div data-role="header"><h1>About This App</h1></div>
<div data-role="content"><p>This app rocks!<a data-role="button" href="#home" >Go home</a></p></div>
</div>
</body>
<!--让链接以按钮方式呈现data-role="button"
切换页面时的效果data-transition="flip"
定义页面data-role="page"(一个html可以定义多个页面)，用id加锚点来跳转
-->
</html>
版权声明：本文为博主原创文章，未经博主允许不得转载。