Question

我开始深入研究jQuery Mobile，我想弄清楚每个页面应该如何构建......

说我有一个应用程序：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">
    <title>jQuery Mobile: Demos and Documentation</title>
    <link rel="stylesheet"  href="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.css" />
    <link rel="stylesheet" href="docs/_assets/css/jqm-docs.css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script>
    <script type="text/javascript" src="experiments/themeswitcher/jquery.mobile.themeswitcher.js"></script>
    <script type="text/javascript" src="docs/_assets/js/jqm-docs.js"></script>
</head> 
<body> 
<div data-role="page" data-theme="b" id="jqm-home">
    <div id="jqm-homeheader">
        <h1 id="jqm-logo"><img src="docs/_assets/images/jquery-logo.png" alt="jQuery Mobile Framework" width="235" height="61" /></h1>
        <p>A Touch-Optimized Web Framework for Smartphones &amp; Tablets</p>
        <p id="jqm-version">Alpha Release</p>
    </div>

    <div data-role="content">

        <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="b">
            <li data-role="list-divider">Overview</li>
            <li><a href="docs/about/intro.html">Intro to jQuery Mobile</a></li>
            <li><a href="docs/about/features.html">Features</a></li>
            <li><a href="docs/about/accessibility.html">Accessibility</a></li>
            <li><a href="docs/about/platforms.html">Supported platforms</a></li>
        </ul>

    </div>
</div>
</body>
</html>

现在，当我导航到“docs / about / intro.html”时，intro.html是否需要拥有与主要移动应用程序相同的所有文档声明？换句话说，<head>，<script>，<link>等...我是否需要声明每个必需的脚本，样式和文档类型参数，就像它是一个单独的页面被加载一样在它上面？

我问的原因是我可以看到，页面实际上并没有加载......就像它被加载到顶部...你实际上并没有去“docs / about / intro.html” ......我错了。

有人可以为我澄清这一切吗？

Answer 1

这是发生的事情（根据我的理解）。

举个例子，jQuery Mobile查找“docs / about / intro.html”，进入它，查找<div data-role="page">，忽略其他所有内容<head>, <body>等。

然后将该网页div添加到您现有的网页中，并将网址更改为“＃/ docs / about / intro.html”（或类似内容）

Answer 2

jquery mobile的工作方式，你必须在加载的第一页的头部有任何脚本和CSS。这可以通过转到scrollview演示来证明。如果您可以从那里导航到任何页面，则可以使用脚本启用scrollview，但如果刷新页面，则会丢失脚本的功能

我建议将以下内容放在所有页面上，原因如下：如果有人在打开主页之前打开'about'页面会怎样？你将获得一个相当难以理解的网页。

Answer 3

查看您想要的Navigation类型，因为有几种不同的型号/类型

Answer 4

对我们来说不幸的是，到目前为止，我已经看到一种解决您的困境的方法是在一个html页面中构建所有网站。我没有看到任何文档解释如何在本地环境中有效地构建由多个页面组成的网站，而不会丢失jquerymobile的精彩转换。

jQuery Mobile：每页需要Docytype和Header信息吗？

4 个答案: