在同一个html文件中的窗口之间移动

时间:2013-02-19 12:15:45

标签: css jquery-mobile

我开始使用本教程使用jQuery Mobile: Displaying windows

但是我现在遇到了一个我不明白的问题。

如果在文件名index.html中包含以下代码,我可以在Windows之间导航,但如果我在名为index3.html的文件中使用相同的代码,则不会工作了......

有谁知道原因?任何解决方案?

<!DOCTYPE html>
<html>
    <head>
    <title>Page Title2</title>

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>

</head>

<body>

    <div data-role=page id=win>
        <!-- Default theme -->
        <div data-role=header>
            <h1>Default theme</h1>
        </div>

        <div data-role=content>
            <p>
                Window content
            </p>
            <a href=#wina> Goto "a" theme </a>
        </div>
    </div>

    <div data-role=page id=wina data-add-back-btn=true>
        <div data-role=header data-theme=a>
            <h1> "a" theme </h1>
        </div>

        <div data-role=content data-theme=a>
            <p>
                Window content
            </p>
            <a href=#winb> Goto "b" theme </a>
        </div>
    </div>

    <div data-role=page id=winb data-add-back-btn=true>
        <div data-role=header data-theme=b>
            <h1> "b" theme </h1>
        </div>

        <div data-role=content data-theme=b>
            <p>
                Window content
            </p>
            <a href=#winc> Goto "c" theme </a>
        </div>
    </div>

    <div data-role=page id=winc data-add-back-btn=true>
        <div data-role=header data-theme=c>
            <h1> "c" theme </h1>
        </div>

        <div data-role=content data-theme=c>
            <p>
                Window content
            </p>
            <a href=#wind> Goto "d" theme </a>
        </div>
    </div>

    <div data-role=page id=wind data-add-back-btn=true>
        <div data-role=header data-theme=d>
            <h1> "d" theme </h1>
        </div>

        <div data-role=content data-theme=d>
            <p>
                Window content
            </p>
            <a href=#wine> Goto "e" theme </a>
        </div>
    </div>

    <div data-role=page id=wine data-add-back-btn=true>
        <div data-role=header data-theme=e>
            <h1> "e" theme </h1>
        </div>

        <div data-role=content data-theme=e>
            <p>
                Window content
            </p>
            <p>
                End of themes
            </p>
        </div>
    </div>

</body>
</html>

更新 我现在注意到,当从另一个页面进入此窗口时,问题才会发生。当我直接输入index3.html的URL时,它可以正常工作。其他页面的代码是:

        <div data-role=content>
            <a href=index3.html> Goto default themes</a>
        </div>

0 个答案:

没有答案