jquery动态获取时间并设置倒计时

项目中待收货订单中需要展示倒计时,根据后台返回的收货时间,设置倒计时显示在页面上。
效果图:


倒计时

首先我用的是setInterval,需要传递两个参数。第一个参数是到期时间,第二个参数遍历的索引。

函数代码如下:

function countDown(endTime,i){

    var time_start = new Date().getTime(); //设定当前时间
    var time_end =  new Date(endTime).getTime(); //设定目标时间
    // 计算时间差
    var time_distance = time_end - time_start;
    // 天
    var int_day = Math.floor(time_distance/86400000);
    time_distance -= int_day * 86400000;
    // 时
    var int_hour = Math.floor(time_distance/3600000);
    time_distance -= int_hour * 3600000;
    // 分
    var int_minute = Math.floor(time_distance/60000);
    time_distance -= int_minute * 60000;
    // 秒
    var int_second = Math.floor(time_distance/1000);
    // 时分秒为单数时、前面加零
    if(int_day < 10 && int_day > 0){
        int_day = "0" + int_day;
    }else if(int_day < 0){  // 日期已过
        $("#tab3").find(".bigbox").eq(i).find("div.countDownRow>p").html("已自动签收");
    }

    if(int_hour < 10){
        int_hour = "0" + int_hour;
    }
    if(int_minute < 10){
        int_minute = "0" + int_minute;
    }
    if(int_second < 10){
        int_second = "0" + int_second;
    }
    if(int_day==0 && int_hour==0 && int_minute ==0 && int_second==0){
        $("#tab3").find(".bigbox").eq(i).find("div.countDownRow>p").html("已自动签收");
    }
    // 显示时间
    var result = int_day+"天"+int_hour+"时"+int_minute+"分"+int_second+"秒";
    $("#tab3").find(".bigbox").eq(i).find("span.countDown").html(result);
    // 设置定时器

    // setTimeout("countDown('"+ endTime + "','" + i +"')",1000); // 这里也可以用setTimeout 在函数体内实现循环

}

调用函数代码如下:

setInterval("countDown('"+receivingEndTime+"','"+i+"')",1000); // 调用倒计时函数

注意调用函数需要传递参数的时候,需要在参数外加上单引号

如果不加上单引号,如:setInterval("countDown("+receivingEndTime+","+i+")",1000) 会报错

error

你可能感兴趣的:(jquery动态获取时间并设置倒计时)