3

我正在用这种方法更改页面

$.mobile.changePage("Preview.html", {
        transition : "slide",
        role : "page",
        changeHash:true                            
    });

这就是我的预览页面的样子

    <div data-role="page"  data-name="preview" class="prew">
        <div data-role="content">
            //content
       </div>
    </div>

现在，当我触摸屏幕时，我必须返回上一页。

所以我创建了这个函数

$('.prew').live('tap', function() {
         alert('clicked');
         history.go(-1);//<--this works in simulator not in device.
         //window.history.back() ;//<--this also works in simulator not on device.
         //navigator.app.backHistory();<--this works fine on android not on iOS.
    });

编辑：我使用了一个名为 photoswipe 的插件，它导致了这个问题。history.go(-1),history.back() 或 data-rel="back" 在其他页面上工作正常。

photoswipe 阻止返回上一页。

4

3 回答 3

6

这是您可以使用的方法。但是，页面应该具有唯一的 ID 才能使其正常工作。

在这里测试一下。

$('.prew').on('tap', function() {

 // get the ID of the previous page
 var previous = '#' + $.mobile.activePage.prev('div[data-role="page"]')[0].id;

 // move to previous page with reverse effect
 $.mobile.changePage(previous, {
    transition: 'slide',
    reverse: true
 });
});
于 2013-03-26T14:22:37.060 回答
5

我不会推荐data-rel="back"。以我的经验，这似乎会导致问题（尤其是当用户使用 ctrl + f5 手动强制重新加载时）。

如果您已正确处理历史记录，那么我建议您使用history.back() function。

$('.prew').live('tap', function() {
    alert('clicked');
    history.back();
});

另外我认为在 Page tag 中使用 ID 比使用 class 更好(e.g. id="prew")。

于 2013-03-26T11:47:59.860 回答
3

因此，不要使用 javascript 方法转到上一页。为什么不向按钮/链接添加 data-rel="back" 属性。

然后一切都将由 jQuery Mobile (JQM) 自己处理。

<a href="#" data-rel="back">Back</a>
于 2013-03-26T07:08:53.317 回答