如何在 jQuery Mobile 中更改页面？ [复制]

我的代码是这样的：

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

    <div data-role="header">

    </div>

    <div data-role="main" class="ui-content">
    <input type="button" value="התחבר" onclick="checkDetails()" />
    </div>

    <div data-role="footer">

    </div>
</div>

现在，通过功能 check Detail() 我需要移动到另一个页面（如下）

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

    <div data-role="header">
        <h3>asd</h3>
    </div>

    <div data-role="content" class="ui-content">

    </div>

    <div data-role="footer">
        <ul>
            <li><a>a</a></li>
            <li><a>as</a></li>
            <li><a>asd</a></li>
        </ul>
    </div>
</div>

问题是当我移动到它时，我到达主页，但它显示为普通的 html 页面而不是 jquery mobile。 顺便说一下，LoginPage 显示为 jQueryMobile，但 HomePage 不是。

我就是这样移动的

$('#LoginPage').hide(function () {
    $('#HomePage').show();
});

您不应该使用$.show() and $.hide()用于页面导航的核心 jQuery 库中的方法。 jQuery Mobile 中的页面导航是通过页面容器小部件-- 具体使用change method.

在您的示例中，您将执行以下操作：

var homePage = $("#HomePage");
$.mobile.pageContainer.pagecontainer("change",homePage,{});