链接到不同html页面中的虚拟页面:JQuery Mobile

时间:2012-09-29 04:40:07

标签: jquery-mobile

我的移动应用程序index.html和individual.html中有2个html页面。 Index.html页面包含许多虚拟页面。我在individual.html页面中有一个按钮。我想将它链接到index.html中的虚拟页面。

有可能吗?

究竟能做到什么?

请帮忙,

由于

1 个答案:

答案 0 :(得分:1)

您可以在individual.html中创建链接按钮,如下所示:您的链接如下:

<a data-role="button" rel="external" href="index.html#your_virtual_page">BUTTON</a>

以下是您的文件index.htmlindividual.html的可用示例:

- index.html

<html>
    <head>
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile.structure-1.1.1.min.css" />
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" />
        <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>
    </head>

    <body>
        <div id="home" data-role="page">
            <div data-role="content">
                HOME   
            </div>
        </div>

        <!-- THE VIRTUAL PAGE THAT WE WANT TO ACCESS FROM individual.html -->
        <div id="p2" data-role="page">
            <div data-role="content">
                PAGE 2!!!
            </div>
        </div>  
    </body>
</html>

- individual.html

<html>
    <head>      
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile.structure-1.1.1.min.css" />
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" />
        <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>          
    </head>

    <body>
        <div id="home" data-role="page">
            <div data-role="content">
                <!-- YOUR LINK TO YOUR VIRTUAL PAGE IN index.html -->
                <a data-role="button" rel="external" href="./index.html#p2">TO PAGE 2</a>
            </div>
        </div>

        <div id="p1" data-role="page">
            <div data-role="content">
                P1
            </div>
        </div>      
    </body>
</html>

希望这有助于交配。