温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

JQuery倒计时和按照指定长度为数字前面补零

发布时间:2020-07-16 22:59:11 来源:网络 阅读:1848 作者:高万耀 栏目:web开发

JQuery按照指定长度为数字前面补零

function PrefixInteger(num, length) {
    return (Array(length).join('0') + num).slice(-length);
}

PrefixInteger(8,2); 返回08,表示长度为2,数字8前面补一个0。

JQuery倒计时

var rest = 4350859;  //时间戳

console.log(rest);

$day = Math.floor(rest/(60*60*24));

console.log($day);

$hour = Math.floor((rest - $day * (60*60*24))/(60*60));

console.log($hour);

$minite = Math.floor((rest - $day * (60*60*24) - $hour * (60*60))/60);

console.log($minite);

$second = Math.floor(rest - $day * (60*60*24) - $hour * (60*60) - $minite * 60);

console.log($second);

$day = PrefixInteger($day,2);
$hour = PrefixInteger($hour,2);
$minite = PrefixInteger($minite,2);
$second = PrefixInteger($second,2);

$("#my_day").html($day);
$("#my_hour").html($hour);
$("#my_minite").html($minite);
$("#my_second").html($second);

window.setInterval(function(){

     rest--;

    console.log(rest);

    $day = Math.floor(rest/(60*60*24));

    console.log($day);

    $hour = Math.floor((rest - $day * (60*60*24))/(60*60));

    console.log($hour);

    $minite = Math.floor((rest - $day * (60*60*24) - $hour * (60*60))/60);

    console.log($minite);

    $second = Math.floor(rest - $day * (60*60*24) - $hour * (60*60) - $minite * 60);

    console.log($second);

    $day = PrefixInteger($day,2);
    $hour = PrefixInteger($hour,2);
    $minite = PrefixInteger($minite,2);
    $second = PrefixInteger($second,2);

    $("#my_day").html($day);
    $("#my_hour").html($hour);
    $("#my_minite").html($minite);
    $("#my_second").html($second);
},1000);
html代码:
<ul class="countdown">
    <li> <span class="days" id="my_day">00</span>
        <p class="days_ref">天</p>
    </li>
    <li class="seperator">.</li>
    <li> <span class="hours" id="my_hour">00</span>
        <p class="hours_ref">时</p>
    </li>
    <li class="seperator">:</li>
    <li> <span class="minutes" id="my_minite">00</span>
        <p class="minutes_ref">分</p>
    </li>
    <li class="seperator">:</li>
    <li> <span class="seconds" id="my_second">00</span>
        <p class="seconds_ref">秒</p>
    </li>
</ul>

这样倒计时功能就完成了,这里css样式就需要大家自己去写了!!!JQuery倒计时和按照指定长度为数字前面补零JQuery倒计时和按照指定长度为数字前面补零


向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI