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倒计时,关 ...
随机推荐
- 撩课-Web大前端每天5道面试题-Day1
1. var的变量提升的底层原理是什么? JS引擎的工作方式是: 1) 先解析代码,获取所有被声明的变量: 2)然后在运行.也就是说分为预处理和执行两个阶段. 变量提升:所有变量的声明语句都会被提升到 ...
- BZOJ5289: [Hnoi2018]排列
传送门 第一步转化,令 \(q[p[i]]=i\),那么题目变成: 有一些 \(q[a[i]]<q[i]\) 的限制,\(q\) 必须为排列,求 \(max(\sum_{i=1}^{n}w[i] ...
- switch的用法
switch case 语句有如下规则: switch 语句中的变量类型可以是: byte.short.int 或者 char.从 Java SE 7 开始,switch 支持字符串 String 类 ...
- 解决The type 'ASP.global_asax' exists in both ASP.global_asax同时存在问题
习惯发布站点的同学有时候可能遇见以下错误 这是发布时[预编译勾选/不勾选]产生的文件冲突导致的 如果不勾选预编译会发布以下代码 如果勾选预编译会发布以下代码 错误就在于此,如果非预编译Global.a ...
- 《Spring实战》第4章--面向切面的Spring--处理通知中的参数(经验总结)
今天学习<Spring实战>第4章<面向切面的Spring>,根据4.3.3小节写出如下切面类: package proxy; import java.util.HashMap ...
- BaseDAL最牛数据层基类2
using System; using System.Data.Entity; using System.Linq; using System.Threading.Tasks; using Syste ...
- web测试实践
参会人员:赵天宇,周静,张双双,张玉 参会地点:微信群 参会内容:决定评测软件 最后会议结论:决定了选择用中国大学mooc(https://www.icourse163.org/)和结合竞品对象-清华 ...
- jsp 发布war 包到Tomcat
1.将项目打包成war,打包过程这里不做赘述 2.在linux或者windows下安装xmapp 3.打开Tomcat下conf/server.xml,在host下添加一行 <Co ...
- centos7 修改中文字符集
CentOS 7字符集的问题与6有点区别,会出现下面问题,查看是中文,vi进入就变成乱码了 生产中修改配置文件 [root@ce1d2002a999 ~]# cat /etc/locale.con ...
- python的学习之路day2
1.什么是常量: 常量在程序中是不变的量 但是在python中所有的变量都可以改 注意:为了防止区分错误,所以python中常量使用大写命名 例如: MYSQL_CONNECTION = '192.1 ...