• Java 获取当前时间及实现时间倒计时功能


    引言

          在一些项目中或是一些特殊的业务场景中,需要用到显示系统的当前时间,以及一些固定的时间倒计时,时间到后做一些什么事情的业务 。接下来咱们就具体看看代码是怎么实现的:

    <%@ page language="java" contentType="text/html; charset=utf-8"
          pageEncoding="utf-8"%>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <!-- <meta content="6;URL=login2.jsp" http-equiv="refresh" > 等待多少秒后自动跳转到另一页面 -->
    <title>时间倒计时</title>
    </head>

    <script type="text/javascript">
       var leftTime=600000; // 1000*1*10 (十分钟)
      //时间倒计时
      function backTime(){
      var d,h,m,s;
      if(leftTime>0){
        d=Math.floor(leftTime/1000/60/60/24);  //天
        h=Math.floor(leftTime/1000/60/60%24);  //时
        m=checkTime(Math.floor(leftTime/1000/60%60));  //分
        s=checkTime(Math.floor(leftTime/1000%60));     //秒
        leftTime=leftTime-1000; //每次进来将总时间减去1秒
        document.getElementById("backtime").innerHTML=" "+h+" :"+m+" :"+s+"" ;
      }else{
        leftTime=600000;//时间到后,重置一个时间
      }
      setTimeout(backTime,1000); //设置定时任务,1秒钟执行一次

      }

      //获取当前时间
      function disptime(){
        var date=new Date();//获取当前时间(包括日期)
       var year=date.getFullYear();
       var month=checkTime(date.getMonth()+1);
       var day=checkTime(date.getDate());
       var hh=checkTime(date.getHours());
       var mm=checkTime(date.getMinutes());
       var ss=checkTime(date.getSeconds());
       document.getElementById("currentTime").innerHTML=" "+year+"-"+month+"-"+day+" "+hh+":"+mm+":"+ss;
       var myTimer=setTimeout("disptime()",1000);
      }


       //在number小于10的数组前补0
       function checkTime(i){
        if(i<10){
         i="0"+i;
        }
        return i;
      }

       window.onload=function(){
         disptime();//当前时间
         backTime();//倒计时
       }
    </script>

    <body>
        <div style="margin-top:8px;">
          当前时间:<font id="currentTime" color="green"></font> &nbsp;&nbsp;&nbsp;&nbsp; <br>
          剩余时间: <font id="backtime" color="red" ></font>
        </div>
    </body>
    </html>

    显示效果:

              

  • 相关阅读:
    对easyui-validatebox的验证类型的扩展,值必须在某个区间
    从零开始学springboot笔记(六)-Spring boot之Spring Boot Spring Data JPA介绍
    从零开始学springboot笔记(五)-Spring boot之Spring Data- JPA 笔记
    从零开始学springboot笔记(四)-Spring boot之热部署之Springbootdevtools(工作中使用)
    JQuery给指定的表格的输入框或其他组件赋值
    oracle开发技巧
    数据库开发要求
    user_tab_columns和user_tab_cols的区别
    windows xp显示文件的后缀
    vue学习遇到的问题
  • 原文地址:https://www.cnblogs.com/zhaosq/p/10918757.html
Copyright © 2020-2023  润新知