javascript的onbeforeunload函数在IOS上运行
今天在做项目的时候,组长让我用iPad测试一下前面写的离线缓存,后退不刷新页面,发现在iPad上onbeforeunload函数在iPad上一带而过,不运行???
无奈之下,发现原来在IOS上,有自己的onshow和onhide方法 //搜索来自:http://www.cnblogs.com/vaal-water/archive/2012/09/25/2701769.html
原文如下:
window.addEventListener("pageshow", myLoadHandler, false);
window.addEventListener("pagehide", myUnloadHandler, false);
function myLoadHandler(evt)
{
if (evt.persisted) {
// This is actually a pageshow event and the page is coming out of the Page Cache.
// Make sure to not perform the "one-time work" that we'd normally do in the onload handler.
... return;
} // This is either a load event for older browsers,
// or a pageshow event for the initial load in supported browsers.
// It's safe to do everything my old load event handler did here.
...
} function myUnloadHandler(evt)
{
if (evt.persisted) {
// This is actually a pagehide event and the page is going into the Page Cache.
// Make sure that we don't do any destructive work, or work that shouldn't be duplicated.
... return;
} // This is either an unload event for older browsers,
// or a pagehide event for page tear-down in supported browsers.
// It's safe to do everything my old unload event handler did here.
...
} if ("onpagehide" in window) {
window.addEventListener("pageshow", myLoadHandler, false);
window.addEventListener("pagehide", myUnloadHandler, false);
} else {
window.addEventListener("load", myLoadHandler, false);
window.addEventListener("unload", myUnloadHandler, false);
}
原文 http://www.webkit.org/blog/516/webkit-page-cache-ii-the-unload-event/ 我自己的程序如下:
先写了一个判断是不是IOS系统的方法:
function isIOS() {
var userAgentInfo = navigator.userAgent;
var Agents = [ "iPhone","iPad"];
var flag = false;
for (var v = 0; v < Agents.length; v++) {
if (userAgentInfo.indexOf(Agents[v]) > 0) {
flag = true;
break;
}
}
return flag;
}
等于这个:
var nav = window.navigator.userAgent.toLowerCase();
var ipad = nav.indexOf("ipad"); 我的理解是:
当页面加载完的时候给window加载监听器
window.addEventListener("pagehide", myUnloadHandler, false);
window.addEventListener("pageshow", myLoadHandler, false); 系统自动识别是不是IOS系统,然后做出处理
if(!parent.isIOS()){} //或者是if(ipad != -1){} 当IOS系统加载的时候,执行myloadHandler函数(相当于js的onload函数),当离开页面的时候执行myUnloadHandler函数(相当于js的onbeforeunload函数),
然后在myloadHandler函数中做出你要执行的加载页面时触发的事件,在myUnloadHandler函数中做出你要离开页面时触发的事件 全部代码以及冗余代码如下:没有删减
var nav = window.navigator.userAgent.toLowerCase();
alert(nav);
var ipad = nav.indexOf("ipad");
alert(parent.isIOS());
if(!parent.isIOS()){
alert("ipad");
alert("SUCCESS");
window.addEventListener("pagehide", myUnloadHandler, false);
/* window.addEventListener("pageshow", myLoadHandler, false);
function myLoadHandler(evt)
{
alert("myLoadHandler");
start = parseInt(sessionStorage.getItem("start"+token));
paramFlag = sessionStorage.getItem("paramFlag"+token);
tokenDiv = sessionStorage.getItem("tokenDiv"+token);
//$("#tokenDiv").html(tokenDiv); 由于放在sessionstorage中的div的id都一样,故吧时间戳作为唯一标识ID
$("#tokenDiv").html(tokenDiv);
} */ function myUnloadHandler(evt)
{
alert("myUnloadHandler");
alert("离开页面了");
var tokenDiv = $("#tokenDiv").html();
sessionStorage.setItem("tokenDiv"+token,tokenDiv);
sessionStorage.setItem("start"+token,start);
sessionStorage.setItem("paramFlag"+token,paramFlag);
}
}
window.onbeforeunload = function(){
alert("离开页面了");
var tokenDiv = $("#tokenDiv").html();
sessionStorage.setItem("tokenDiv"+token,tokenDiv);
sessionStorage.setItem("start"+token,start);
sessionStorage.setItem("paramFlag"+token,paramFlag);
/* if ("onpagehide" in window) {
alert("one");
window.addEventListener("pageshow", myLoadHandler, false);
window.addEventListener("pagehide", myUnloadHandler, false);
} else {
alert("two");
window.addEventListener("load", myLoadHandler, false);
window.addEventListener("unload", myUnloadHandler, false);
} */
}
javascript的onbeforeunload函数在IOS上运行的更多相关文章
- ios那些事之如何在ios5上运行gdb
为啥要在ios上运行gdb? 这个问题见仁见智喽.对于搞开发的同学们来所, 有了gdb更方便跟踪分析别人的程序,取长补短:)这里不是教大家crack:) 运行环境: Mac OS 10.7.4 Xco ...
- react native-调用react-native-fs插件时,如果数据的接口是需要验证信息的,在android上运行报错
调用react-native-fs插件时,如果数据的接口是需要验证信息的,在android上运行报错,而在iOS上运行没问题.原因是因为接口是有验证信息的,而调用这个插件时没有传入,在iOS上会自动加 ...
- HTML5定稿了,终于有一种编程语言开发的程序可以在Android和IOS两种设备上运行了
2007 年 W3C (万维网联盟)立项 HTML5,直至 2014 年 10 月底,这个长达八年的规范终于正式封稿. 过去这些年,HTML5 颠覆了 PC 互联网的格局,优化了移动互联网的体验,接下 ...
- 将 java 项目打包成可运行的 jar 包(main 函数带参数),并上传到 linux 服务器上运行
一.概述 java项目有两种架构,一种是 B/S 架构的,一种是 C/S 架构的. 对于 B/S 架构来说,我们常见的 java ee 即是 B/S 架构,通常,开发人员会在本地进行开发,然后将项目打 ...
- ios:如何将自己编写的软件放到真正的iPhone上运行(转)
想要将自己编写的软件放到真正的iPhone上去运行,首先你需要成为Apple Developer计划的成员.其次,你需要设置程序ID和认证书,在这之后你就可以在你指定的iPhone上运行你的程序了.下 ...
- win10 上运行 curl_init() 函数一直报错的解决办法
[问题现象] 1.把 APACHE 的 ZIP 包解压到目录,比如 d:\apache24\ 2.把 PHP 的 ZIP 包解压到目录,比如:d:\php56\ apache 与 php 与 MySQ ...
- iOS开发手记 - iOS9.3 Xcode7打包ipa文件在其他越狱机器上运行的方法和一些问题
现在Xcode7可以用一个appleid就可以往手机上部署测试app,不再需要$99,这也是方便.但是要把app发给别人的手机上运行还是不行,除非别人的手机在你身边可以直接通过Xcode安装 关于怎么 ...
- 微坑---微信小程序ios上时间字符串转换为时间戳时,在开发工具上和安卓手机上运行成功
给定一个时间字符串 var time="2017-02-27 16:42:53" js有三种转换为时间戳的方法:1.var timestamp = Date.parse(time ...
- 微信小程序ios上时间字符串转换为时间戳时会报错,在开发工具上和安卓手机上运行成功
给定一个时间字符串 var time="2017-02-27 16:42:53" js有三种转换为时间戳的方法: 1.var timestamp = Date.parse(tim ...
随机推荐
- 从svn服务器自动同步到另一台服务器
需求场景 A commit B post-commit C (workstation) --------------> (svn server) ---------------------> ...
- BZOJ1432 [ZJOI2009]Function
Description Input 一行两个整数n; k. Output 一行一个整数,表示n 个函数第k 层最少能由多少段组成. Sample Input 1 1 Sample Output 1 H ...
- codeforces 375D:Tree and Queries
Description You have a rooted tree consisting of n vertices. Each vertex of the tree has some color. ...
- HDU 2896 病毒侵袭
Problem Description 当太阳的光辉逐渐被月亮遮蔽,世界失去了光明,大地迎来最黑暗的时刻....在这样的时刻,人们却异常兴奋——我们能在有生之年看到500年一遇的世界奇观,那是多么幸福 ...
- html5+ 获取当前设备的加速度信息
getCurrentAcceleration 获取当前设备的加速度信息 void plus.accelerometer.getCurrentAcceleration( successCB, error ...
- event.keycode值大全
window.event.keycode-获取按下的键盘值 event.keycode值大全1 keycode 8 = BackSpace BackSpace 2 keycode 9 = Tab ...
- JS面试题及答案总结
1. 截取字符串abcdefg的efg <div id="test">abcdefg</div> var mytext=document.getEleme ...
- Android SDK安装Android4.0“冰激淋三明治”(IceCreamSandwich)教程(转载)
昨天,Google举行了发布会,发布了Nexus Prime手机和Android4.0-IceCreamSandwich手机系统.作为Google旗下Android的最新版本手机系 统,Android ...
- spring mvc实现登录+异常
登录页面login.jsp在webroot下 <body> <form action="user/login" method="post"&g ...
- motto5
No matter what others say,I won't forsake my priciples.