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

  • HTTP错误 403.14 服务器配置为不列出此目录内容

    HTTP错误 403.14 服务器配置为不列出此目录内容HTTP错误 403.14 服务器配置为不列出此目录内容HTTP错误 403.14 服务器配置为不列出此目录内容HTTP错误 403.14 服务器配置为不列出此目录内容

    开发一个企业网站,使用ASP技术,在本地通过IIS管理器调试,出现 如下问题: HTTP 错误 403.14 – Forbidden Web 服务器被配置为不列出此目录的内容 解决方法: 在”功能视图“,中找到”目录浏览“,双击进入 在目录浏览右侧操作中选择”启用“! 这时再浏览网站,可以看到已经不报错了,但是网站是以文件目录的形式展现的! 这是…

    2018年7月3日 编程开发
    5.9K0
  • Myeclipse设置JSP视图和代码显示在同一个窗口

    Myeclipse设置JSP视图和代码显示在同一个窗口Myeclipse设置JSP视图和代码显示在同一个窗口Myeclipse设置JSP视图和代码显示在同一个窗口Myeclipse设置JSP视图和代码显示在同一个窗口

    Myeclipse开发时,想同时查看页面及代码视图,如上图,而默认只能看到代码。 Myeclipse设置JSP页面和代码显示在同一个窗口的方法有两种。 一、在JSP页面上右击-open with-other… 在弹出的Editor selection窗口中选择web page editor,就可以了。 二、选择 window-preferences,如下图,…

    2018年12月17日 编程开发
    6.1K0
  • Java GUI编程高级实例一:给应用程序添加菜单

    一、给GUI应用程序添加菜单 菜单的作用:给应用程序设置操作菜单。 菜单组成 JMenuItem—菜单项,直接指向一个具体的操作 JMenu—菜单,其中可加入菜单项(JMenuItem)和菜单(Jmenu) JMenuBar—-菜单栏,在其中可以加入菜单(JMenu) 菜单的创建 JMenu、JMenuBar和JMenuI…

    2020年1月22日
    12.0K0
  • myeclipse的视图显示:如何显示上下拆分的视图,design视图和Preview预览视图合并

    MyEclipse10打开JSP页面发现只有代码视图,想同时看到design视图和代码视图,如何把这两个视图显示出来? myeclipse显示上下拆分的design视图和代码视图方法 1、在JSP页面上右键单击,选择open with->web page editors,如果显示里没有web page editors,需要单击Other……,在里面选择…

    2018年10月10日
    6.5K0
  • Pycharm Django项目 NameError: name ‘os’ is not defined

    Pycharm Djarngo项目报错 NameError: name ‘os’ is not defined 原因:这里调用了os模块,但是文件头并没引用os模块解决办法:在settings.py文件头加上 import os

    2024年12月2日
    1.1K0
  • 上机实战八:Java web编程综合案例

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

    2018年12月11日
    7.9K0

发表回复

登录后才能评论