该data-url
属性用于跟踪页面元素的来源。如果没有明确设置,则嵌入在主应用程序文档中的页面都具有data-url
与 page 相同的属性id
。唯一的例外是文档的第一页。当您请求一个页面时,jQuery Mobile 首先会尝试data-url
在 DOM 中找到一个匹配的页面。如果它没有找到这样的页面,那么它会执行一个 Ajax 请求并在 DOM 中加载新页面。
您可以使用以下 3 种方法之一解决此问题:
当您移动到另一个页面时,使用下面的代码从 DOM 中删除第二个页面。
$(document).on('pagehide', '#second-page', function(event, ui){
$(event.target).remove();
});
这样,当您移动到第一页时,第二页将从 DOM 中删除,您的问题将得到解决。
或:
利用:
$.mobile.changePage('car-details.html', {
data: {
id: this.id
}
});
不使用dataUrl
设置。
这将创建一个 URL:../car-details.html?id=my_val
刷新时,URL 保持不变,因此您仍然可以获取参数,并且data-url
与页面 ID 相同。
或者
在changePage()
检查data-url
DOM 中是否存在与第二个页面的 id 相等的页面并手动将其删除之前。
if ($("#second-page-id").length > 0 && $("#second-page-id").attr("data-url") === 'second-page-id' ) {
console.log('remove from DOM');
$("#second-page-id").remove();
}