js倒计时,页面刷新时,不会从头计时
最近不忙,瞎鼓捣...哈哈
这里利用了H5的本地存储 localStorage,取秒数直接用了php的time()方法,就懒得用js取了。
把第一次访问页面时的时间存在客户端,然后再刷新的时候,比较用户第一次访问的时间和当前刷新时的时间。
这样就可以避免刷新的时候从头计时。当然方法有很多哈哈。
<div id='xx'></div>
<script>
var first_access_time = localStorage.getItem("first_access_time");
var i = 10;
if (first_access_time){
var refresh_time = "<?php echo time();?>";
time(i - (refresh_time - first_access_time));
} else {
localStorage.setItem("first_access_time", '<?php echo time();?>');
time(i);
} function time(i){
if (i <=0){
location.href = 'http://www.google.cn';
return;
}
document.getElementById('xx').innerHTML = i;
setTimeout('time('+(--i)+')', 1000);
}
</script>
js倒计时,页面刷新时,不会从头计时的更多相关文章
- js中页面刷新和页面跳转的方法总结
.js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...
- js中页面刷新和页面跳转的方法总结 [ 转自欢醉同学 ]
.js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...
- 用js判断页面刷新或关闭的方法
Onunload,onbeforeunload都是在刷新或关闭时调用,可以在<script>脚本中通过window.onunload来指定或者在<body>里指定.区别在于on ...
- WOW.js – 在页面滚动时展现动感的元素动画效果
在一些网页上,当你滚动页面的时候会看到各式各样的元素动画效果,非常动感.WOW.js 就是一款帮助你实现这种 CSS 动画效果的插件,很容易定制,你可以改变动画设置喜欢的风格.延迟.长度.偏移和迭代等 ...
- sharepoint 2010 页面刷新时滚动条位置保持不变 Controlling scrollbar position on postback
sharepoint 2010 页面刷新时滚动条位置保持不变 Controlling scrollbar position on postback在sharepoint 2010中,如果当前页面的篇幅 ...
- react+antd分页 实现分页及页面刷新时回到刷新前的page
antd框架地址:https://ant.design/index-cn 利用antdUI框架做了个分页,其他功能都没问题,但是页面跳转后刷新会回到第一页,经过学习,在组件里增加了hash值,详情请看 ...
- js当前页面刷新并且清空文本内容的方法
js当前页面刷新并且清空文本内容的方法: 1.js代码:location.reload(); 2.html:<body onload="document.forms[0].reset( ...
- vue常见问题处理 -- 页面刷新时,如何保持原有vuex中的state信息
一.页面刷新时,如何保持原有vuex中的state信息 页面刷新后,原有的 vuex 中的 state 会发生改变,如果在页面刷新之前,可以将 state 信息保存,页面重新加载时,再将该值赋给 st ...
- JS倒计时(刷新页面不影响)的实现思路
最近在做一个项目,用到了点击按钮实现倒计时,这个用js来实现很简单.但是遇到了一个问题 页面刷新后js重新加载导致 倒计时重新开始,或者直接初始化了 后来通过 cookie 保存来实现了js倒计时,关 ...
随机推荐
- 小程序通过用户授权获取手机号之getPhoneNumber
小程序有一个获取用户很便捷的api,就是通过getPhoneNumber获取用户的已经绑定微信的手机号码.有一点要大家注意,现在微信和注重用户体验,有些方法都是需要用户主动去触发才能调用的,比如get ...
- bootstrap datetimepicker日期插件美化
效果 https://segmentfault.com/img/bVbieIp?w=1029&h=461 原文链接:https://segmentfault.com/a/11900000167 ...
- NodeJS配置TaoBao源
npm install -g cnpm --registry=https://registry.npm.taobao.org
- ArcGIS Server + ArcGIS Portal 10.5
1.安装IE11 2. 域名需要在C:\Windows\System32\drivers\etc\host文件中添加 127.0.0.1 机器名.域名 win2008.smartmap.com 19 ...
- PHPCMS V9开发文档
内容模块 内容模块PC标签调用说明 模块名:content 模块提供的可用操作 操作名 说明 lists 内容数据列表 relation 内容相关文章 hits 内容数据点击排行榜 category ...
- Html5+离线打包创建本地消息
自己离线打包Html5+ Runtime,通常是导入SDK的Hello实例,然后修改.在做消息通知功能时,使用push.createMessage不起作用. 首先参考Android平台离线打包推送插件 ...
- 【Python】opencv显示图像
import cv2 img = cv2.imread("lena.jpg") cv2.namedWindow("Image") cv2.imshow(&quo ...
- centOS7中Mariadb数据库安装与基本管理
一.Mariadb数据库安装 1. 直接yum源安装 yum -y install mariadb mariadb-serversystemctl start mariadb /启动Mariadb服务 ...
- VS2010/2013 运行是很卡的加速方案
前段时间为了一个项目而把VS2008换成了VS2010,结果原本就不堪重负的本本跑起VS2010来那更是慢得没话说,于是看了遍VS2010选项,又从网上到处找资料找优化方法,总算使我的VS2010跑得 ...
- 数据库导入.bacpac 文件创建新实例
先连接好数据库,然后打开左侧 对象资源管理器,选择数据库 右键单击 ---> 选择导入数据层应用程序 根据提示向导一步步走就行了 部分导入失败以及处理方案 异常1 : 在数据库master中拒 ...