在@ IPad上的Safari上按“后退”按钮时,不会收到“pageshow”

时间:2012-04-11 13:03:37

标签: javascript jquery safari mobile-safari

我有以下处理程序:

        $(window).bind('pageshow', function() { alert("back to page"); });

当我离开页面时(通过按下链接)并返回页面(通过按“返回”按钮), alert()未被调用(IPad 2,iOS 5.1)。

我做错了什么?我需要绑定的任何其他事件?

PS:有趣的是,当离开页面时, Pagehide 被正确接收。

6 个答案:

答案 0 :(得分:8)

您可以查看persisted事件的pageshow属性。初始页面加载时设置为false。从缓存加载页面时,它设置为true。

window.onpageshow = function(event) {
    if (event.persisted) {
        alert("back to page");
    }
};

由于某些原因,jQuery在事件中没有此属性。你可以从原始活动中找到它。

$(window).bind("pageshow", function(event) {
    if (event.originalEvent.persisted) {
      alert("back to page");
    }
};

答案 1 :(得分:7)

这可能是一个缓存问题。当您通过“后退”按钮返回页面时,页面将从缓存中拉出(行为取决于浏览器)。因此,你的JS不会触发,因为页面已经在缓存中呈现,重新运行你的js可能对布局等有害。

您应该能够通过在响应中调整缓存标头或使用一些浏览器技巧来克服这个问题。

以下是该问题的一些链接:

修改

这些都来自上述链接:

  • history.navigationMode = 'compatible';
  • <body onunload=""><!-- This does the trick -->
  • “Firefox 1.5+和Safari的下一个版本(其中包含针对错误28758的修复程序)支持名为pageshowpagehide的特殊事件。”
  • 使用jQuery的$(document).ready(handler)
  • window.onunload = function(){};

答案 2 :(得分:5)

你正在做的是将alert("back to page")的返回值绑定为回调。那不行。您需要绑定一个函数:

$(window).bind('pageshow', function() { alert("back to page"); });

答案 3 :(得分:1)

我添加了一个相同的问题,即iOS在返回时并不总是发布“ pageshow”事件。

如果没有,Safari会继续在页面上执行JS,因此尽管计时器会继续触发。

所以我想到了这个解决方案:

var timer;

function onPageBack() { alert("back to page"); }

window.addEventListener('pageshow', function() {
    if (event.persisted)
        onPageBack();

    // avoid calling onPageBack twice if 'pageshow' event has been fired...
    if (timer)
        clearInterval(timer);
});

// when page is hidden, start timer that will fire when going back to the page...
window.addEventListener('pagehide', function() {
    timer = setInterval(function() {
        clearInterval(timer);
        onPageBack(); 
    }, 100); 
});

答案 4 :(得分:0)

我这样解决了这个问题;

$(window).bind("pageshow", function () {

    setTimeout(function () {
        back();
    }, 1000);

});

function back() {
   //YOUR CODES
}

答案 5 :(得分:0)

您应该查看您的页面是否具有iFrame组件?我不知道为什么,但是我删除了iFrame组件来解决此问题