pc端网页,移动端网页(andorid、ios)离开页面做一个时间存储
如图所示:在一个页面中做了一个倒计时,然后用户想离开页面做其他事情,需求是离开页面之后把时间保存,下一次进来继续的时候时间还是上次离开的时间
第一次我用的事件是: // window.onbeforeunload = function() {。。。}但是ios移动端是没有任何反应的,也就是不兼容。
第二次我用的是: window.addEventListener('pagehide', function () {....})完美解决。
- onbeforeunload 支持的手机浏览器见 WindowEventHandlers/onbeforeunload
- 对于 Safari 浏览器可以使用
pagehide
,详见 Handling Events
window.addEventListener('pagehide', function () { // localStorage.setItem("selftestid",selftestid);
// localStorage.setItem("remainderlength",remainderlength);
console.log(selftestid)
console.log(remainderlength) $.ajax({
type: 'post',
url: "...",
type: 'post',
async: false,
data: {
key: key,
id: selftestid,
remainderlength: remainderlength//时间存储后台
},
dataType: 'json',
success: function(result) {
console.log(result);
}
})
// }
});
在这里我最初的思想是放在本地存储中,但是后来一想如果用户在本次操作的网页和下次操作的手机如果不一样,那么是获取不到本地存储的内容的,所以就存在服务器中了
pc端网页,移动端网页(andorid、ios)离开页面做一个时间存储的更多相关文章
- (Android+IOS)我们正在做一个新闻App,做几乎一样的,倾听您的建议 (画画)
(Android+IOS)我们正在做一个新闻App,做几乎一样的,倾听您的建议! 新闻采访是做,前端展示APP界面感觉还不是非常好,还须要改进改进,希望公布(Android和IOS版本号)前听听大家的 ...
- iOS 利用UICollectionView做一个无限循环广告栏
一.效果图 左右丝滑滑动,并且有缩放动画. 二.分析和思路 1. 为什么选择用UICollectionView去做上面的效果? 首先无限效果永远是表现出来的,而不是程序里面创建了无数个view,如何做 ...
- 移动端底部fixed固定定位输入框ios下不兼容
简短记录下最近开发移动端项目碰到的小坑,产品需求做一个售后对话页面,底部固定输入框,和微信对话差不多,但是在ios下,fixed失效,输入框被虚拟键盘挡住,在安卓下是正常的. 尝试过网上说的很多方法, ...
- 网页背景H5视频自动播放---PC端、移动端兼容问题完美解决方案(IOS、安卓、微信端)
最近公司官网需要使用视频当做banner背景且自动播放,并且因为是官网需要做到PC端和移动端都可以适配兼容,这些问题很是头疼: 兵来将挡,水来土掩,进过查阅相关技术资料,现已完美兼容PC端和移动端.下 ...
- EasyNVR摄像机网页无插件直播方案H5前端构建之:如何区分PC端和移动端
背景分析 随着互联网基础设施建设的不断完善和发展,带宽的不断提速,尤其是光纤入户,4G/5G/NB-IoT各种网络技术的大规模商用,视频随时随地可看.可控的诉求越来越多,尤其是移动应用技术和前端技术的 ...
- cordova使用webrtc与网页端及移动端视频、语音聊天
最近在做一个移动端与移动端.网页端文字.视频.语音聊天的功能.文字聊天使用websocket,在网上很多资料,也没什么难度.但是在视频.语音聊天上遇到了小小的难点.之前一直在找一些SDK想快速开发,例 ...
- java 自制Tomcat Andorid IOS 端 证书
java 自制证书 最近做项目用到Https 需要自制各种证书,Tomcat 用的JKS 格式, Andorid 端使用 BKS 格式, IOS 端使用 P12格式正式, 以及各种证书格式之间的转换. ...
- JS判断android ios系统 PC端和移动端
最近公司上线移动端,需要根据不同的系统跳转到不同的产品页面,百度后发现这一段代码很好用,不但可以判断当前是什么系统,还能知道当前浏览器是什么内核,移动端PC端都已测试无问题! var browser ...
- PC端、移动端的页面适配及兼容处理
转自 一.关于移动端兼容性 目前针对跨终端的方案,主要分为两大阵营:一套资源Vs两套资源. 第一种是通过响应式或页面终端判断去实现一套资源适配所有终端: 第二种是通过终端判断分别调取两套资源以适配所有 ...
随机推荐
- property与x.setter与x.deleter
#测试property,x.setter,x.deleter class Test1: def __init__(self): self.__private = "alex" @p ...
- Django_ORM_字段属性
Django_ORM_字段属性 常用字段 AutoField int自增列,必填参 primary_key=True 默认会自动创建一个列名为id的列 IntegerField 一个整数类型,范围在 ...
- 【JVM】深度分析Java的ClassLoader机制(源码级别)
原文:深度分析Java的ClassLoader机制(源码级别) 为了更好的理解类的加载机制,我们来深入研究一下ClassLoader和他的loadClass()方法. 源码分析 public abst ...
- yii2 redirect重定向
redirect使用方法 $this->redirect(array('/site/contact','id'=>12)); //http://www.kuitao8.com/testwe ...
- mysql5.7 修改root密码无法登陆原因
升级的mysql5.7修改完root账户密码后仍然无法登陆,查阅资料可能和user表的plugin 字段为空有关. 1.首先将my.ini中加入在[mysqld]节点上加skip-grant-tabl ...
- 老男孩Python全栈学习 S9 日常作业 001
1.简述变量命名规范 必须以字母.数字.下划线命名,且不能以数字开头 不能是python的关键字 不能以中文或者拼音作为变量名 命名格式推荐以驼峰式或者下划线连接命名 区分大小写 要有意义,具有可描述 ...
- 为什么wait()方法要放在同步块
回顾一下,如果wait()方法不在同步块中,代码的确会抛出异常: public class WaitInSyncBlockTest { @Test public void test() { try { ...
- 查看linux的cpu信息
# 总核数 = 物理CPU个数 X 每颗物理CPU的核数 # 总逻辑CPU数 = 物理CPU个数 X 每颗物理CPU的核数 X 超线程数 # 查看物理CPU个数 cat /proc/cpuinfo| ...
- DataBase vs Data Warehouse
Database https://en.wikipedia.org/wiki/Database A database is an organized collection of data.[1] A ...
- springMVC中 @RequestParam和@RequestBody的区别
首先,不可以同时传进@RequestParam和@RequestBody,好像可以传进两个@RequestParam 如果不加@requestparam修饰,相当于 加上@requestparam且各 ...