Question

我正在构建我的第一个jQuery移动应用程序，但我不确定如何设置不同的页面。现在我只想要用id＆＃34标记的div;一个＆＃34;显示，然后我想要一个链接，当按下时显示标记为id＆＃34;两个＆＃34;的div。我创建了一个具有不同阶段的阅读应用程序，我只希望一次显示一个阶段。我做错了什么？

    <body>

    <div data-role="page" id="one">

        <div data-role="header">
            <h1>Phase 1</h1>
        </div><!-- /header -->

        <div role="main" class="ui-content">
            <p>Page content goes here.</p>
        </div><!-- /content -->

        <div data-role="footer">
            <h4><a href="#two">Next</h4>
        </div><!-- /footer -->
    </div><!-- /page -->

    <div data-role="page" id="two">

        <div data-role="header">
            <h1>Phase 2</h1>
        </div><!-- /header -->

        <div role="main" class="ui-content">
            <p>Page content goes here.</p>
        </div><!-- /content -->

        <div data-role="footer">
            <h4>Page Footer</h4>
        </div><!-- /footer -->
    </div><!-- /page -->

</body>

Answer 1

试试这些或在jsfiddle中查看这些代码。

<div data-role="page">
        <div data-role="header">
            <h1>Phase One</h1>
        </div>
        <div data-role="content">
            <ul data-role="listview">
                 <div role="main" class="ui-content">
                <p>Page content goes here.</p>
            </div>
                <li><a href="#page2">Next</a></li>
            </ul>
        </div>
    </div>
    <div id="page2" data-role="page">
        <div data-role="header">
            <a href="#" data-rel="back">Back</a>
            <h1>Phase Two</h1>
            <div data-role="navbar">
                <ul>
                    <li><a href="#">One</a></li>
                    <li><a href="#">Two</a></li>
                </ul>
            </div><!-- /navbar -->  
        </div>
        <div data-role="content">
            <div id='aDiv'>Page content goes here</div>
        </div>
    </div>

如何在jQuery mobile中隐藏某些页面？

1 个答案: