有什么正确的方法可以多次链接到同一个页面？
我正在尝试使用一个页面来显示相同类型的数据(比如水果)。然后，我想加载这个页面在我的网站层次结构的任何地方，但每次都有不同的参数。
我的主页如下所示，有两个指向同一页面的链接( show.html )
<div data-role="navbar" data-iconpos="top" data-theme="a" class="nav-ecommera">
<ul >
<li>
<a href="show.html?p=apples" data-role="button">Apples</a>
</li>
<li>
<a href="show.html?p=oranges" data-role="button">Oranges</a>
</li>
</ul>
</div>单击这两个按钮中的每个按钮将在DOM中创建页面show.html的一个新实例。因此，show.html中的所有项都将在DOM中具有重复的ID。
在我的javascript中，我想动态地填充show.html页面：
$('div[id="show"]').live("pagebeforeshow", function(e, data) {
var p = getUrlParameter("p");
show(p);
});
var show = function(p) {
$.ajax({
url:'http://show.com/?p='+p,
success: function(data) {
// Refresh 'show' page with new data
// First time: It's fine.
// Second time: 'show' page is duplicated in the DOM so it's messy.
}
});
}现在，当show.html第一次加载时，一切都很好。但是，第二次加载show.html中的所有内容两次，DOM包含许多重复的ID。
是否有方法在加载新页面之前从DOM中删除第一个页面？
或者：
有什么更好的方法来做我在这里想要达到的目标吗？
更新：我已经尝试在加载一个新的show页面时删除以前的show页面实例。它适用于显示第二页。但是，当第一页需要在手动删除后第二次显示时，会出现一个问题。
我认为原因是jQuery手机似乎认为第一页已经加载，尽管我们手动删除了它。因此，当再次访问时，它不会完全重新加载第一个页面。我说的是导航序列: home -> Apples、-> Back to home、-> Orange ->回到Home -> Apples (这里有一个叛变的页面)。
回答 2
Stack Overflow用户
发布于 2012-04-19 09:52:43
1)你可以把身份改为上课。
2)您可以使用封装show.html的包装器，当您试图第二次加载它时，可以找到先前加载的那个，然后删除它。
你的show.html：
<div class='previous-load'>
... enclosed show.html HTML ...
</div>JavaScript：
$('div[id="show"]').live("pagebeforeshow", function(e, data) {
var p = getUrlParameter("p");
show(p);
});
var show = function(p) {
$(".previous-load").remove();
$.ajax({
url:'http://show.com/?p='+p,
success: function(data) {
// Refresh 'show' page with new data
// First time: It's fine.
// Second time: 'show' page is duplicated in the DOM so it's messy.
}
});
}Stack Overflow用户
发布于 2012-04-19 10:07:37
您可以通过具有show.php选项的$.mobile.changePage()加载reloadPage页面：
//bind to all links that have an HREF attribute that starts with "show.html"
$('a[href^="show.html"]').bind('click', function () {
//set a default query-string for the page-load
var query = '';
//if this link's HREF attribute has a query-string, use it
if (this.href.indexOf('?') > -1) {
query = this.href.split('?')[1];
}
//forward the user to the page, telling jQuery Mobile to reload the page
//which will use the new query-string sent
$.mobile.changePage('show.html', { reloadPage : true, data : query });
//prevent the default behavior of the click
return false;
});reloadPage (布尔值，默认值: false)
强制重新加载页面，即使它已经在页面容器的DOM中。仅当changePage()的'to‘参数是URL时才使用。以下是$.mobile.changePage()的文档：
来源：
当jQuery移动加载同一页面两次时，这是因为HREF属性中的data-url属性与伪页面元素上的data-url属性不匹配。要调试此问题，请确保在将data-url属性插入到DOM中时，检查将哪些属性添加到show.html页面中。如果它似乎不匹配，那么可以在元素上设置一个data-url属性，如下所示：
<div data-url="/show.html" data-role="page" id="show-page">
...
</div>然后，您将始终使用URL：/show.html链接到页面。
https://stackoverflow.com/questions/10233745
复制相似问题
腾讯云开发者
