home.html的

Question

我刚开始研究jquerymobile，使用jquery.mobile-1.0a1完成了简单的示例。

我有home.html，auboutus.html网页。在主页中，我有一个listview，其中包含aboutus.html的外部链接。它工作正常，通过点击关于我们链接，关于我们页面正在加载带有“后退”按钮的头部导航栏。

现在使用jquery.mobile-1.0a2，在我们的页面中，标题导航栏消失了。

以下是我的示例代码：

home.html的

<!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>

aboutus.html

<!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>

Answer 1

你应该考虑使用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>

jquerymobile：导航无法使用jquery.mobile-1.0a2

home.html的

aboutus.html

1 个答案: