更新

Question

我使用多页面模板创建我的页面，我读到只有起始页面（例如index.aspx）在加载时仍然保留在每个页面的Dom中。但现在在我的其他页面（例如child.aspx），它是页面parent.aspx的子页面，我可以看到parent.aspx页面的dom元素。面包屑如下：索引---＆gt;父---孩子，也许我应该只看到索引dom内容不是父。这让我想知道为什么页面是这样的以及我如何处理它。谢谢

更新

我只想重新加载每个节目的每一页，我的意思是完全清除DOM并从头开始加载内容。就像你按ctrl + f5并加载没有缓存的页面一样。这在JQM中是否可行？

的Index.aspx：

    <form id="form1" runat="server" dir="rtl">
            <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode = "Conditional">
            <ContentTemplate>
        <asp:ScriptManager ID="ScriptManager" runat="server"></asp:ScriptManager>
        <uc2:MblMyMessageBox ID="MblMyMessageBoxInfo" runat="server" ShowCloseButton="true" /> 
    <div data-role="page" id="home"> 
        <div data-role="header">
            <h1>header</h1>
        </div>
        <div data-role="content">   
            <ul data-role="listview" data-inset="true" data-filter="false">
                <li data-icon="false"><a href="AccountStatus.aspx">AccountStatus</a></li>
                <li data-icon="false"><a href="ConfirmPayment.aspx">ConfirmPayment</a></li>
            </ul>   
        </div>
    </div>
            </ContentTemplate>
    </asp:UpdatePanel>
</form>

AccountStatus.aspx：

 <div data-role="page" id="accountStatus">
    <div data-role="header">
        <h1>Header</h1>
    </div><!-- /header -->
    <div data-role="content">   
        <ul data-role="listview" data-inset="true" data-filter="false">
            <li data-icon="false"><a href="BalancePage.aspx" data-prefetch="true">balance</a></li>
            <li data-icon="false"><a href="InvoicePage.aspx">invoice</a></li>
        </ul>           
    </div><!-- /content -->
    <div data-role="footer">
        <p><a href="Index.aspx">back</a></p>
    </div><!-- /footer -->
 </div><!-- /page -->

从accountStatus页面删除索引内容dom元素是我的目的。

Answer 1

用户导航到的所有页面都将添加到dom中。见the documentation。但是，jQM还有a mechanism来防止DOM变大并减慢浏览器的速度。它可能会也可能不会从DOM中删除旧元素。我建议你不要相信DOM元素会被自动删除。如果您确实要删除要导航的页面，可以绑定例如以下内容：

$(document).one("pageshow",function(){
     $(document).one("pagehide",function(){
          $("#pageId").remove();
     });
});

其中pageId是您为<div data-role="page" id="pageId">提供的ID。

修改更新的问题：在关注链接时重新加载整个页面：

指向其他域或具有rel =“external”的链接， data-ajax =“false”或目标属性不会被Ajax加载。相反，这些链接将导致整页刷新而没有动画过渡。

来源：jQuery Mobile Docs

或者您可以使用following global variable：

进行更改

$.mobile.ajaxEnabled = false;

jquery mobile中的多页模板

更新

1 个答案: