10秒倒计时、考试结束倒计时功能实现代码-JS

注册成功或登录后网页会有倒计时,如5秒后跳转到哪个页面的功能。

在做一些在线测试,网上考试系统时,会用到倒计时功能。

如网上考试系统里,会有时间提示离考试结束还有多长时间,临近考试结束剩10分钟,还可以弹窗提示考生。

10秒倒计时、考试结束倒计时功能实现代码-JS

JavaScript实现倒计时功能代码

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>10秒倒计时功能代码|www.125jz.com</title>
 </head>
 <body></body>
 <SPAN style="BACKGROUND: #00bfff" id=time>10</SPAN>秒钟后自动跳转.<br />
 如果不跳转,请点击下面的链接<A href=http://www.125jz.com> 125网页设计</A>
  <SCRIPT language=JavaScript type=text/javascript> 
  function delayURL(url) { var delay=document.getElementById("time").innerHTML;
  if(delay>0) {
   delay--;
   document.getElementById("time").innerHTML = delay;
  } else {
   window.top.location.href = url;
  }
 setTimeout("delayURL('" + url + "')", 1000);
  }
 </SCRIPT>
 <SCRIPT type=text/javascript> delayURL("http://www.125jz.com"); </SCRIPT> 
 </body> 
</html>

防刷新的考试结束倒计时JavaScript代码

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>距离考试结束还有分秒|www.125jz.com</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>

网页设计交流群:208047327

125jz网原创文章。发布者:江山如画,转载请注明出处:http://www.125jz.com/8851.html

(0)
江山如画的头像江山如画管理团队
上一篇 2020年10月27日 上午9:56
下一篇 2020年11月1日 上午9:46

99%的人还看了以下文章

  • 上机实战七:EL和JSTL的使用

    建议学时:2 一、使用EL表达式简化javaBean的开发 编写一个用户登录的JavaBean,用户信息包括用户名和密码。 编写user.jsp,使用setProperty设置用户名为125jz,密码为123。 使用EL获取用户名和密码并显示。 二、使用EL实现问卷调查 用户输入昵称、所在城市,并且以多选的方式让用户选择所使用的开发语言,然后使用EL表达式显…

    2018年12月4日
    8.7K0
  • JSP一次上传多个文件(基于jspSmartUpload)

    支持中文的jsp文件上传组件:jspSmartUpload.jar下载 可以一次上传多个文件 upload.html <html> <head> <title>网页设计:文件上传</title> <meta http-equiv=”Content-Type” content=”text/html; cha…

    编程开发 2021年11月25日
    2.5K0
  • Python 8大知识点——附详细实例代码。

    目录 1. for – else 2.lambda函数 3.列表推导式 4.列表索引的各种骚操作 5.三元表达式 6.巧用断言assert 7.while语句 8.with – as 1. for – else 什么?不是 if 和 else 才是原配吗?No,你可能不知道,else 是个脚踩两只船的家伙,for 和 else 也是一对,而且是合法的。十大装…

    2023年1月14日
    1.9K0
  • 上机实战八:Java web编程综合案例

    建议学时:6 一、开发基于MVC模式的信息管理系统,如新闻发布系统,要求用户可查看、查询。管理员进入后台可对发布新闻(实现相应的增删查改)。 后台添加文章,建议使用UEditor! UEditor 是开源、免费的在线HTML编辑器,主要用于让用户在网站上获得所见即所得编辑效果。 UEditor兼容性很好,是网站站长开发的首选,官网地址:UEditor官网 包…

    2018年12月11日
    6.6K0
  • 推荐!Django 新手入门图文教程

    一、Django简介 百度百科:一个开放源代码的Web框架,由Python语言编写…… 重点:一个大而全的框架,啥都替你考虑好了。 1. web框架介绍 具体介绍Django之前,必须先介绍Web框架的概念。 Web框架: 别人已经设定好的一个Web网站模板,你学习它的规则,然后“填空”或“修改”成你自己需要的样子。 一般Web框架的…

    2023年1月24日 编程开发
    5.4K0
  • Java课程设计报告-记事本源代码有流程图

    Java课程设计报告 题 目:简单记事本程序的设计年级专业:计算机科学与技术  软件工程学 号:学生姓名:指导老师: 目    录 摘要… 1 前言… 2 1需求分析… 2 1.1需求分析… 2 1.2功能设计… 3 2.概要设计… 3 2.1程序设计思路… 3 2.2程序运…

    2019年10月4日
    4.6K0

发表回复

登录后才能评论