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%的人还看了以下文章

  • JSP制作后台登录页面:login.jsp

    设计数据库employee,manager表,字段:user_id (主键,自增1,int类型),user_name, password 创建数据源:employee_dsn 制作登录页面login.jsp 登录页面 login.jsp代码: <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transition…

    2020年12月6日
    6.2K0
  • Tkinter(Python GUI编程)从入门到精通(一)

    什么是Tkinter 一个 GUI 程序一般由窗口、下拉菜单或者对话框等图形化组件构成, 通过鼠标点击菜单栏、按钮或者弹出对话框的形式来实现人机互动,从而提升人机交互的体验,让“冰冷”的程序变得有“温度”。 注意:GUI 这一概念并非 Python 语言独有,它属于计算机科学技术领域中的一个概念,比如使用 C/C++ 语言开发的 Qt、GTK、Electro…

    2022年8月20日
    5.8K0
  • OpenCV-最优秀的Python人脸识别库安装及入门教程

    OpenCV库(open source computer vision library)是一个基于BSD许可(开源)发行的跨平台计算机视觉和机器学习软件库,可以运行在Linux、Windows、Android和Mac OS操作系统上,具有跨平台特性,轻量级且高效,实现了图像处理和计算机视觉方面的很多通用算法。 OpenCV用C++语言编写,它具有C ++,P…

    2020年12月8日
    13.8K2
  • 基于jspSmartUpload的Jsp文件上传:防止文件重名被覆盖的解决方法

    基于jspSmartUpload的Jsp文件上传:防止文件重名被覆盖的解决方法 支持中文的jsp文件上传组件:jspSmartUpload.jar下载 upload_repeat.html <html> <head> <title>中国网页设计:文件上传</title> <meta http-equiv=…

    2018年12月11日
    2.3K0
  • 第五章 JavaBean技术

    掌握:
    JavaBean的概念及规范
    JavaBean的创建与使用
    JavaBean属性的获取及修改
    getProperty:获取bean的属性值
    setProperty:设置bean的属性值

    2018年2月22日
    7.4K0
  • python 集合的使用,案例详解

    集合的定义: 1.不同元素组成 2.无序 3.集合中的元素必须是不可变类型 创建集合 s = {1,2,3,4,5,6,7,8} >>> set_test = set(‘hello’) >>> set_test {‘h’, ‘l’, ‘e’, ‘o’}  # 由此可见集合中的元素不可重复,都是不同的 集合运算 集合之间也可…

    2020年1月22日
    12.4K0

发表回复

登录后才能评论