js 和 java 将时间倒计时显示

 需求：用户购买产品，创建了一个订单，但是还么有支付，此时给用户三十分钟剩余支付时间，前台页面做倒计时功能，时间到达时，更改订单状态 ，输出的格式是：29:23

java 实现

package com.project.test;

import java.text.SimpleDateFormat;
import java.util.Calendar;
import java.util.Date;

import org.apache.commons.validator.Var;
import org.junit.Test;
import org.omg.CORBA.PRIVATE_MEMBER;

import com.sun.org.apache.xerces.internal.parsers.IntegratedParserConfiguration;

import IceInternal.Time;
import sun.util.logging.resources.logging;

/*
 * @author xiaoyi
 * @see 倒计时转化工具类
 */
public class TimeConvert {
    
private final static Long DEFAULT_TIME=(long) (30*60*1000);  //超时时间
    
    
    /*
     * @see 将字符串转化为时间格式
     */
    public static Date convertStrToDate(String strDate){
        Calendar calendar=Calendar.getInstance();
        if(strDate != null){
            String[] dateAndTime=strDate.split(" ");
            String[] dateStr=dateAndTime[0].split("-");
            String[] TimeStr=dateAndTime[1].split(":");
            calendar.set(Integer.parseInt(dateStr[0]), Integer.parseInt(dateStr[1])-1, Integer.parseInt(dateStr[2]),
                    Integer.parseInt(TimeStr[0]), Integer.parseInt(TimeStr[1]), Integer.parseInt(TimeStr[2]));
        }
        return calendar.getTime();
    }
    
    /*
     * 左边添加0
     */
    public static String addLeftZero(Long tempNum){
        String num="00";
        if(tempNum<10){
            num="0"+tempNum;
        }else if(tempNum==0){
            num= "00";
        }else{
            num=""+tempNum;
        }
        
        return num;
    }
    
    /*
     * //将毫秒数转化为倒计时 eg :29:30
     */
    public static String  formatDate(Long num){
        String tem="00:00";
        if(num>0){
            Long minute=num/60/1000;
            Long yushu=num%(60*1000);
            Long second=yushu/1000;
            tem= TimeConvert.addLeftZero(minute)+":"+TimeConvert.addLeftZero(second);
        }else{
            tem= "00:00";
        }
        return tem;
    }
    
    
    /*
     * 计算还剩多少时间
     */
    public String calculateTime(String initTime){
        String  remainTime="00:00"; //剩余时间
        if(initTime !=null){
        Date nowDate=new Date();
        Long timeLength=(long) (TimeConvert.convertStrToDate(initTime).getTime()+DEFAULT_TIME-nowDate.getTime()); //求当时间和下单时间的差（毫秒）
            remainTime=TimeConvert.formatDate(timeLength);
        }
        return remainTime; 
    }
    
    //测试
    public static void main(String[] args) {
        TimeConvert timeConvert=new TimeConvert();
        SimpleDateFormat dateFormat=new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
        System.out.println(new TimeConvert().calculateTime("2017-12-29 15:09:56"));
　　　　　　
    }
    
}

 

将后台的数据传递到jsp页面，怎么做倒计时，代码如下

 

var showTimeInterval;
$(function(){
    setTimeout(function(){
         if($(".needTime").length>0){
             liveTime.initData('${orderDetail.ORDERID}');
            //定时器，修改订单剩余支付时间
            showTimeInterval=window.setInterval(
                    function(){
                        liveTime.remindTime($(".needTime").html(),".needTime",".title"); //将倒计时格式
                    },1000); //每一秒刷新一次
            } 
    },1000)
      
});

 创建一个js

livetime.js

/*计算订单的剩余时间*/
var globeNowTime=new Date();
var oderId=null;
var liveTime={
        initData:function(orderIdArgs){
            oderId=orderIdArgs;
        },
        convertStrToDate:function(dateString) {  //将字符串时间转化
            if (dateString) { //2017-12-01 13:12:15
                    var arg1 = dateString.split(" ");  //分割日期和时分秒 
                    var arg2 = arg1[0].split('-'); 
                    var arg3=  arg1[1].split(':');
                    var date = new Date(arg2[0], arg2[1]-1, arg2[2],arg3[0],arg3[1],arg3[2]);  //分别对应 年 月 日 时 分 秒
                    return date;
                            } 
            },
            addLeftZero:function(tempNum){  //两位数，左边补0
                if(tempNum<10){
                    return "0"+tempNum;
                }else if(tempNum==0){
                    return "00";
                }else{
                    return tempNum;
                }
            },
            formatDate:function(num){  //将毫秒数转化为倒计时 eg :29:30
                if(num>0){
                    var minute=parseInt(num/60/1000);
                    var yushu=num%(60*1000);
                    var second=parseInt(yushu/1000);
                    return liveTime.addLeftZero(minute)+":"+liveTime.addLeftZero(second);
                }else{
                    return "00:00";
                }
            },
            updateOrderInfo:function(){  //更新数据库订单状态
                var url = "/core/recordExplain.updLiveOrderState.do";
                var postData={"orderId":oderId};
                $.getMyJSON(url,postData,function(data){
                    console.info("更新成功");
                });
            },
        globeCalculateTime:function(initTime){  //列表调用此方法    e 传入this
            var remainTime="00:00"; //剩余时间
            var timeLength=globeNowTime.getTime()-liveTime.convertStrToDate(initTime).getTime(); //求当时间和下单时间的差（毫秒）
                remainTime=liveTime.formatDate(timeLength);
            return remainTime;  
            },
        calculateTime:function(initTime){  //定时器调用此方法
            var remainTime="00:00"; //剩余时间
            var nowDate=new Date();
            var timeLength=nowDate.getTime()-liveTime.convertStrToDate(initTime).getTime(); //求当时间和下单时间的差（毫秒）
                remainTime=liveTime.formatDate(timeLength);
            return remainTime; 
        },
        remindTime:function(getTime,className,className2){  //剩余时间倒计时
            var tt="00:00";
            if(getTime != null){
                var tempTime=getTime.split(":");
                var timeLength=parseInt(tempTime[0])*60*1000+parseInt(tempTime[1])*1000-1000;
                if(timeLength<1000){  //当订单剩余时间小于1 秒的时候，开始更新数据库的订单状态
                    //TODO something
                    liveTime.updateOrderInfo();  //更新数据
                    //并且将定时器关闭
                    clearInterval(showTimeInterval); 
                    //修改名称
                    $(""+className2).html("订单失效");
                }else{
                    tt=liveTime.formatDate(timeLength);
                }
                
            }
            
            $(""+className).html(tt);
        }
        
        
}

 

    屏幕已经开始倒计时