JQM页面ID和数据URL

Question

JQM页面ID和数据URL

4

页面ID和data-url属性之间有什么关系？它们之间是否有联系？更改data-url属性是否会影响页面？我的问题是，我使用changePage传递参数到某个页面，并在changePage中指定了data-url。进入该页面后，如果手动刷新页面，就会添加一个新页面，因为该页面的data-url与页面ID不同。即，data-url变成与页面ID相同。希望我表达清楚了。那我该怎么办，才能在手动刷新页面时替换页面呢？此外，能否有人解释一下JQM如何使用页面ID和data-url？谢谢。

- user694688

浏览器的位置是由data-url的值更新的，该值是页面的id。当您刷新时，如果没有指定值，它将使用页面id更新浏览器的位置。 - Omar

1

请查看此示例，希望它能澄清data-url的概念。请注意浏览器的URL具有自定义的#标签，这与页面的id不同。但是一旦您刷新，data-url将使用页面id替换自定义值。代码在这里。 - Omar

请问您能否更好地解释一下这个问题。我有两个不同的HTML页面，称为页面A和B。我从A传递一些参数到B，并将数据URL指定为“/test/B?type=123”。我能够在页面B中检索到该参数。当我刷新页面时，数据URL会更改，并添加一个新页面，其数据URL与页面ID相同。我的疑问是：1）我应该怎么做才能替换数据URL为“/test/B?type=123”的页面。2）当我刷新页面时，如何获取参数值type = 123，因为它将不可用。 - user694688

我认为在刷新页面时无法保留传递的参数。但是，如果您从window.location.hash中检索它，则可能会起作用。我仍需要进行测试。http://jsfiddle.net/Palestinian/EvkDH/show/ - Omar

刷新页面后，浏览器会删除先前访问的页面并加载当前.html文件中的页面。对于页面使用相同的ID会使事情变得复杂，最好使用唯一的ID。 - Omar

显示剩余8条评论

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Apostolos Emmanouilidis · Accepted Answer

data-url属性用于跟踪页面元素的来源。如果没有明确设置，则嵌入到主应用程序文档中的所有页面都会将其 data-url 属性设置为页面 id 。唯一的例外是文档中的第一页。当您请求页面时，jQuery Mobile首先尝试在DOM中查找具有匹配 data-url 的页面。如果它找不到这样的页面，那么它将执行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
    }
});

不使用设置，将创建一个URL: ../car-details.html?id=my_val

刷新后URL保持不变，因此仍然可以获取参数，data-url与页面ID相同。或者在changePage()之前检查DOM中是否存在data-url等于第二个页面的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();
}