我刚开始研究jquerymobile,使用简单的样本jquery.mobile-1.0a1.
我有home.html,auboutus.html页面.在主页中,我有一个listview,其中包含aboutus.html的外部链接.它工作正常,通过点击关于我们链接,关于我们页面正在加载带有"后退"按钮的头部导航栏.
现在通过使用jquery.mobile-1.0a2,在我们的页面中,标题导航栏消失了.
这是我的示例代码:
<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<link rel="stylesheet" href="jquery-mobile/jquery.mobile-1.0a2.min.css" />
<script src="jquery-mobile/jquery-1.4.4.min.js"></script>
<script src="jquery-mobile/jquery.mobile-1.0a2.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header" data-theme="b">
<h1>Home</h1>
</div>
<div data-role="content">
<div id="banner">
<h2></h2>
</div>
<ul data-role="listview">
<li><a href="aboutus.html" >About Us</a>
</li></ul>
</div><!-- /content -->
</div><!-- /page -->
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<link rel="stylesheet" href="jquery-mobile/jquery.mobile-1.0a2.min.css" />
<script src="jquery-mobile/jquery-1.4.4.min.js"></script>
<script src="jquery-mobile/jquery.mobile-1.0a2.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header" data-theme="b">
<h1>About Us</h1>
</div>
<div data-role="content">
<div id="banner">
<h2>About Us</h2>
</div>
<p>about us about us about us about us </p>
</div><!-- /content -->
</div><!-- /page -->
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
你应该考虑使用JQuery mobile更喜欢的页面设计.你可以在这里找到它,你不需要定义不同的.html文件,你可以简单地将不同id的多个'pages'添加到一个html文件中.引用很简单.看看这个链接:http://jquerymobile.com/demos/1.0a4.1/docs/pages/docs-navmodel.html#../../docs/pages/docs-pages.html
如果您想引用外部链接,请尝试以下方法: <a href="multipage.html" rel="external">Link</a>
| 归档时间: |
|
| 查看次数: |
2778 次 |
| 最近记录: |