脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → js防刷新倒计时代码

js防刷新的倒计时代码 js倒计时代码

 更新时间：2017年09月06日 09:50:44   投稿：lijiao  
这篇文章主要为大家详细介绍了js防刷新的倒计时代码，js倒计时的实现代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

最近在维护考试系统，在进行考试测试时无意中点击了刷新按钮，但是上面的倒计时并没有受到影响，同时在几篇博客中也有这样的例子，所以我想看看它到底是怎样防止刷新的。

如果是用cs代码写，我们可能会很快的写出来怎样防止刷新，可是我们要进行前段开发，考试是在页面上进行的，这里就要用到我们学到的js了。

<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"content="text/html; charset=gb2312" />
<title>前端开发</title>

</head>

 

<body>

<SCRIPT LANGUAGE="JavaScript">
<!--
var maxtime;
if(window.name==''){
maxtime = 1*60;
}else{

maxtime = window.name;

}

 

function CountDown(){
if(maxtime>=0){
minutes = Math.floor(maxtime/60);
seconds = Math.floor(maxtime%60);
msg = "距离考试结束还有"+minutes+"分"+seconds+"秒";
document.all["timer"].innerHTML = msg;
if(maxtime == 5*60) alert('注意，还有5分钟!');

--maxtime;

window.name = maxtime;

}

else{
clearInterval(timer);
alert("考试时间到，结束!");

}

}

timer = setInterval("CountDown()",1000);
//-->

</SCRIPT>

<div id="timer"style="color:red"></div>

 

</body>

</html>

其实，这里最主要的思想就是，我们将时间放到一个变量中，刷新后，我们从变量中接着读取这个数据即可。我们也可以用cookie存开始时间，刷新以后先读取cookie。方法也许不只是这一个，希望大家有更好地方法来多多交流。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

相关文章

  • 微信小程序中的video视频实现 自定义播放按钮、封面图、视频封面上文案

    微信小程序中的video视频实现 自定义播放按钮、封面图、视频封面上文案

    这篇文章主要介绍了微信小程序中的video视频实现 自定义播放按钮、封面图、视频封面上文案,本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
    2020-01-01
  • JavaScript canvas复刻苹果发布会环形进度条

    JavaScript canvas复刻苹果发布会环形进度条

    canvas 真是一个好东西，它给前端插上了想象的翅膀，伴随着 h5 而来，将 web 代入了新的领域。本文将利用anvas复刻苹果发布会环形进度条，感兴趣的可以尝试一下
    2022-07-07
  • 理解JS绑定事件

    理解JS绑定事件

    这篇文章主要帮助大家深入理解JS绑定事件，介绍了六种JS绑定事件的情况，感兴趣的小伙伴们可以参考一下
    2016-01-01
  • 一文教你如何优雅的使用WebSocket

    一文教你如何优雅的使用WebSocket

    WebSocket最大特点就是服务器可以主动向客户端推送信息,客户端也可以主动向服务器发送信息,是真正的双向平等对话,属于服务器推送技术的一种,下面这篇文章主要给大家介绍了关于如何优雅的使用WebSocket的相关资料,需要的朋友可以参考下
    2022-05-05
  • js控制href内容的连接内容的变化示例

    js控制href内容的连接内容的变化示例

    这篇文章主要介绍了使用js控制href内容的连接内容的变化,需要的朋友可以参考下
    2014-04-04
  • 微信小程序生成二维码的示例代码

    微信小程序生成二维码的示例代码

    这篇文章主要介绍了微信小程序生成二维码的示例代码，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
    2019-03-03
  • 微信小程序自定义底部弹出框功能

    微信小程序自定义底部弹出框功能

    这篇文章主要为大家详细介绍了微信小程序自定义底部弹出框功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2020-11-11
  • JS判断图片是否加载完成方法汇总(最新版)

    JS判断图片是否加载完成方法汇总(最新版)

    有时需要获取图片的尺寸，这需要在图片加载完成以后才可以。下面小编给大家整理了几种关于JS判断图片是否加载完成方法汇总，一起看看吧
    2016-05-05
  • javaScript在表单提交时获取表单数据的示例代码

    javaScript在表单提交时获取表单数据的示例代码

    本文介绍了五种在JavaScript中获取表单数据的方法：使用FormData对象、手动提取表单数据、使用querySelector获取单个字段数据、序列化为查询字符串和配合AJAX提交表单数据,每种方法都有示例代码,帮助开发者更好地理解和应用
    2025-02-02
  • javascript闭包的使用之按钮切换功能

    javascript闭包的使用之按钮切换功能

    闭包就是能够读取其他函数内部变量的函数.这篇文章通过实例代码给大家介绍了javascript闭包的使用之按钮切换功能，感兴趣的朋友一起看看吧
    2018-08-08

最新评论