文档介绍：wangjian223344的专栏
JQuery mobile 2 多个页面一个文件
分类: 手持html5phone Gap JQuery moblie 2013-11-06 15:05 62人阅读评论(0) 收藏举报
html5html5技术移动浏览器jquery mobile
在jquerymobile中我们可以将多个页面写到同一个html中,只要我们按照jquerymobile的要求加上对应的属
性,jquerymobile会为我们将他们转变成几个分开的页面,每次显示的时候默认只会显示第一个。下面先看代码然
后再解释:
[html] view plaincopy
1. <!doctype html>  
2. <html>  
3. <head>  
4. <meta charset="utf-8">  
5. <title>data-role="page"</title>  
6. <meta name="viewport" content="width=device-width,initial-scale=1" />   
7. <link rel="stylesheet" href="jqm/-"/>  
8. <script src="jqm/jquery-"></script>  
9. <script src="jqm/-"></script>  
10. </head>  
11.   
12. <body>  
13. <div data-role="page" id="home">  
14.     <div data-role="header">  
15.         <h1>header</h1>  
16.     </div>  
17.     <div data-role="content" id="homecontent">  
18.         this is home content!!  
19.         <a href="#ohter">Other page</a><a href="" data-
ajax="false"></a>  
20.     </div>  
21.     <div data-role="footer" id="footer">  
22.         <h4> Footer</h4>  
23.     </div>  
24. </div>  
25. <div data-role="page" id="ohter">  
26.     <div data-role="header" id="other_header">  
27.         <h1>other_header</h1>  
28.     </div>  
29.     <div data-role="content" id="other_content"