0

请有人让我摆脱痛苦并告诉我为什么这不起作用?

我有一个简单的 2 页测试站点 - 每个页面都有一个标题和一个指向另一页面的链接 - 所以你可以从一个页面点击到下一个页面然后返回等等。

网站加载时一切看起来都很好 - 第 1 页显示有标题。单击按钮到第 2 页,页面加载,但标题未像第 1 页那样呈现。

我不认为我必须为如此简单的测试做任何特别的事情,但无法找出问题所在。

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
    <title>Mobile Test</title> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
</head>
<body> 
    <div data-role="page" id="pg_1">
        <div data-role="header" data-position="fixed">
            <h1>Page 1</h1>
        </div>
        <div data-role="content">
            <a data-role="button" data-rel="close" href="#pg_2">Goto Page 2</a>
        </div>
    </div>
    <div data-role="page" id="pg_2">
        <div data-role="header" data-position="fixed">
            <h1>Page 2</h1>
        </div>
        <div data-role="content">
            <a data-role="button" data-rel="close" href="#pg_1">Goto Page 1</a>
        </div>
    </div>
</body>
</html>

我也尝试过使用 jQuery 1.7,但结果相同。

我一定是在做一些愚蠢的事情,但就是看不到。任何帮助都非常感谢。

问候尼莫

编辑:无法添加图片,因为我是新手,但可以在第 1 页和第 2 页看到他们在寻找我

http://i104.photobucket.com/albums/m186/Nymor/misc/jqm_t1-1.png
http://i104.photobucket.com/albums/m186/Nymor/misc/jqm_t1-2.png
4

1 回答 1

0

您必须data-rel="close"从链接中删除。

这是解决方案:

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
    <title>Mobile Test</title> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
</head>
<body> 
    <div data-role="page" id="pg_1" data-position="fixed">
        <div data-role="header">
            <h1>Page 1</h1>
        </div>
        <div data-role="content">
            <p><a data-role="button" href="#pg_2">Goto Page 2</a></p>
        </div>
    </div>
    <div data-role="page" id="pg_2" data-position="fixed">
        <div data-role="header">
            <h1>Page 2</h1>
        </div>
        <div data-role="content">
            <p><a data-role="button" href="#pg_1">Goto Page 1</a></p>
        </div>
    </div>
</body>
</html>
于 2012-05-01T14:14:58.957 回答