jQuery Mobile中的$ .mobile.changePage-更新可见的URL? [英] $.mobile.changePage in jQuery Mobile - update visible URL?

问题描述

我正在尝试在jQuery Mobile中添加一个changePage事件.

I'm trying to add a changePage event in jQuery Mobile.

基本上，我想加载一个带有"pop"过渡的新页面.至关重要的是，我还希望更新显示的URL(以便用户可以链接到新页面)，并且希望该页面出现在历史记录中.

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.

目前我正在尝试:

 $('#mylink').click(function(){
    $.mobile.changePage('/photo.html?p=14545', { transition: "pop"} );
 });     
 <a id="mylink">Click here</a>

但是，这不会更新显示的URL，并且页面似乎也无法正确加载.

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，而不是哈希URL.我正在尝试找到一种方法来转到外部页面，并将URL更新为外部页面的URL.谢谢！

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!

推荐答案

实时示例: http://jsfiddle. net/r4DyU/1/

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:

$('#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'); 
});

这篇关于jQuery Mobile中的$ .mobile.changePage-更新可见的URL?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！