Javascript javascript中的pageShow事件

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/6363199/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 21:25:26  来源:igfitidea点击:

pageShow event in javascript

javascriptjquery

提问by facebook

I have the following code:

我有以下代码:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="http://code.jquery.com/jquery-1.4.4.min.js"></script>

    <script type="text/javascript" language="javascript">
    $( function() {
        window.onload = function () {
            alert('This page was just hidden:');
        }
    });
    </script>
</head>
<body pageshow="alert('Done');">
<div id="mypage" data-role="page"  data-theme="b"> 
    <div data-role="header">
        <h1>Page 2</h1>
    </div> 
    <div data-role="content">
        <p>This is page 2.</p> 
    </div> 
</div> 
</body>
</html>

But the pageShowevent is not firing in IE. Any idea why?

但该pageShow事件并未在 IE 中触发。知道为什么吗?

回答by James Wiseman

OnPageShow and OnPageHide are new HTML5 event attributes, and as such will only enjoy limited browser support (at the time of writing)

OnPageShow 和 OnPageHide 是新的 HTML5 事件属性,因此只能享受有限的浏览器支持(在撰写本文时)

Its more likely that later versions of incumbent browsers will support it. Firefox certainly will, as will Safari according to this article.

现有浏览器的更高版本更有可能支持它。Firefox 肯定会,正如本文所述的 Safari 一样。

I couldn't find anything that stated it definitively, but I would say that its likely that these events aren't supported in the version of IE that you are using. Can you maybe post this information for clarification.

我找不到任何明确说明的内容,但我想说您使用的 IE 版本可能不支持这些事件。您能否发布此信息以进行澄清。

Hope this helps

希望这可以帮助

回答by gblazex

Your code is inconsistent. You're using jQuery.ready, onload, onpageshowat the same time. Seems like a good place to start your refactoring process.

你的代码不一致。您正在使用jQuery.readyonloadonpageshow在同一时间。似乎是开始重构过程的好地方。

What do you really want to achieve?

你真正想要达到什么目标?

回答by sahid

It is a mispell; in the body's tag, the name of the event is "onpageshow" and no "pageshow".

这是一个拼写错误;在正文的标签中,事件的名称是“onpageshow”而不是“pageshow”。

...
<body onpageshow="alert('Done');">
...

For IE pageshow event is not supported.

不支持 IE pageshow 事件。

回答by dan gibson

From my tests:

从我的测试:

  • IE8/9 does not support pageshow/pagehide
  • Chrome12 fires them but doesn't appear to have a page cache - they behave the same as load/unload
  • FF4 supports them as expected
  • iOS on iPad supports them as expected
  • IE8/9 不支持页面显示/页面隐藏
  • Chrome12 触发它们但似乎没有页面缓存 - 它们的行为与加载/卸载相同
  • FF4 按预期支持它们
  • iPad 上的 iOS 按预期支持它们

回答by George Cummins

Your jQuery code never gets executed. You should run it from within jQuery's "ready" event:

你的 jQuery 代码永远不会被执行。你应该在 jQuery 的“ready”事件中运行它:

$( function() {
    $('#mypage').live('pageshow', function (event, ui) {
        alert('This page was just hidden: ' + ui.prevPage);
    });
});

回答by Techgration

PageShow event is not supported in older versions of Internet Explorer, which is most likely the problem that you are having.

旧版本的 Internet Explorer 不支持 PageShow 事件,这很可能是您遇到的问题。

回答by Troy SK

Do away with window.onloadand pageshow. Whatever you want to be executed on window load, body load or page show put them in $(document).ready(), they will be executed serially once the page has been loaded.

去掉window.onloadpageshow。无论您想在窗口加载、正文加载或页面显示中$(document).ready()执行什么操作,它们都将在页面加载后串行执行。

回答by Ravi Parekh

i'm using FF 4.0.1

我正在使用 FF 4.0.1

your pageShow event won't fire even in this.

即使在这种情况下,您的 pageShow 事件也不会触发。

click here

点击这里

for more information

想要查询更多的信息

Update:pageShowfire after pageLoad.

更新:pageShowpageLoad.

it's better to use onLoad.

最好使用onLoad.

pageShowshould be onpageShow

pageShow应该 onpageShow

回答by robocat

The pageshow event doesn't work in many browsers e.g. if using WebView or UIWebView within an App on mobile.

pageshow 事件在许多浏览器中不起作用,例如,如果在移动应用程序中使用 WebView 或 UIWebView。

Instead you need a four pronged attack:

相反,您需要四管齐下的攻击:

  1. onfocusoccurs when desktop pages and some mobile pages come back to life

  2. pageshowoccurs when iOS Safari comes back to life - but not UIWebView

  3. visibilitychangeoccurs when Windows Mobile IE11 comes back to life - see http://daniemon.com/tech/webapps/page-visibility/and try http://jsbin.com/runed/4Edit: Looks like IE11 on WP8.1 now supports the pageshow event.

  4. webkitRequestAnimationFramedetects if page inside Mobile App comes back to focus. Workaround needed because window.focus, visibilitychange and pageshow events don't work in Android apps (WebView) or iOS apps (UIWebView).

  1. onfocus当桌面页面和一些移动页面恢复生机时发生

  2. pageshow当 iOS Safari 恢复生机时发生 - 但不是 UIWebView

  3. visibilitychange当 Windows Mobile IE11 恢复生机时发生 - 请参阅http://daniemon.com/tech/webapps/page-visibility/并尝试http://jsbin.com/runed/4编辑:现在看起来像 WP8.1 上的 IE11支持pageshow事件。

  4. webkitRequestAnimationFrame检测移动应用程序内的页面是否重新获得焦点。需要解决方法,因为 window.focus、visibilitychange 和 pageshow 事件在 Android 应用程序 (WebView) 或 iOS 应用程序 (UIWebView) 中不起作用。

Code might look like:

代码可能如下所示:

window.addEventListener('focus', pageAwakened);
window.addEventListener('pageshow', pageAwakened);
window.addEventListener('visibilitychange', function() {
    !document.hidden && pageAwakened();
});
if (window.webkitRequestAnimationFrame && (/^iP/.test(navigator.platform) || /Android/.test(navigator.userAgent))) {
    webkitRequestAnimationFrame(webkitWake);
}

var lastTs;
function webkitWake(timestamp) {
    if ((timestamp - lastTs) > 10000) {
        pageAwakened();
    }
    lastTs = timestamp;
    webkitRequestAnimationFrame(webkitWake);
}

function pageAwakened() {
    console.log('awakened at ' + (new Date));
}

If you wish to support <= IE8 or documentMode <= 8 then need attachEvent for focus.

如果您希望支持 <= IE8 或 documentMode <= 8,则需要 attachEvent 以获得焦点。

Edit: Note that most modern browsers (including desktop IE11 and desktop Edge) support the pageshow event.

编辑:请注意,大多数现代浏览器(包括桌面 IE11 和桌面 Edge)都支持 pageshow 事件。

回答by Adil

$(function(){ //your code })

Is the shorthand for $(document).ready(). document.ready fires just after the DOM is loaded, adding a window.onload inside it is unnecessary.

是 $(document).ready() 的简写。document.ready 在 DOM 加载后立即触发,在其中添加 window.onload 是不必要的。

IE wont fire a "pageshow" event, since it doesn't recognize it.

IE 不会触发“pageshow”事件,因为它无法识别它。