jQuery Mobile 中的 $.mobile.changePage - 更新可见 URL？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6412533/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
$.mobile.changePage in jQuery Mobile - update visible URL?
提问by Richard
I'm trying to add a changePage event in jQuery Mobile.
我正在尝试在 jQuery Mobile 中添加 changePage 事件。
Basically I'd like to load a new page with a "pop" transition. Crucially I'd also like the displayed URL to update (so the user can link to the new page) and I'd like the page to appear in history.
基本上我想加载一个带有“pop”转换的新页面。至关重要的是，我还希望更新显示的 URL（以便用户可以链接到新页面），并且我希望该页面出现在历史记录中。
Currently I'm trying:
目前我正在尝试：
$('#mylink').click(function(){
$.mobile.changePage('/photo.html?p=14545', { transition: "pop"} );
});
<a id="mylink">Click here</a>
However, this isn't updating the displayed URL, and the page also doesn't seem to load correctly.
但是，这不会更新显示的 URL，并且页面似乎也无法正确加载。
Any advice on how to make sure the URL is correctly updated and displayed?
关于如何确保正确更新和显示 URL 的任何建议？
Thanks!
谢谢！
UPDATE
更新
note that this is an external URL, not a hash URL. I'm trying to find a way to go to the external page, and update the URL to that of the external page. Thanks!
请注意，这是一个外部 URL，而不是哈希 URL。我正在尝试找到一种转到外部页面的方法，并将 URL 更新为外部页面的 URL。谢谢！
回答by Phill Pafford
Live Example: http://jsfiddle.net/r4DyU/1/
现场示例：http: //jsfiddle.net/r4DyU/1/
HTML:
HTML：
<div data-role="page" data-theme="c" id="page1">
<div data-role="content">
<p>This is Page 1</p>
<button type="submit" data-theme="a" name="submit" value="submit-value" id="submit-button-1">Open Dialog</button>
</div>
</div>
<div data-role="page" data-theme="a" id="page2">
<div data-role="content">
<p>This is Page 2</p>
<button type="submit" data-theme="e" name="submit" value="submit-value" id="submit-button-2">Close Dialog</button>
</div>
</div>
JS:
JS：
$('#submit-button-1').click(function() {
$.mobile.changePage($('#page2'), 'pop');
});
$('#submit-button-2').click(function() {
alert('Going back to Page 1');
$.mobile.changePage($('#page1'), 'pop');
});
// Or try this: Adding the URL
$('#submit-button-1').click(function() {
$.mobile.changePage('/photo.html?p=14545', 'pop');
});
$('#submit-button-2').click(function() {
alert('Going back to Page 1');
$.mobile.changePage('/photo.html?p=14545', 'pop');
});
回答by Waldex Pérez Callejas
$.mobile.changePage("#yourpage", { dataUrl: "#yourpage?x=1&y=2", transition: "fade" });
$.mobile.changePage("#yourpage", { dataUrl: "#yourpage?x=1&y=2", transition: "fade" });
回答by crispydc
In order to update the location hash you need to specify the new url in the changePage options paramter:
为了更新位置哈希，您需要在 changePage 选项参数中指定新的 url：
$.mobile.changePage('/photo.html?p=14545', {dataUrl: "/photo.html?p=14545", transition: "pop"});
