jsp实现时间倒计时功能

最新推荐文章于 2024-05-08 17:14:35 发布

原创最新推荐文章于 2024-05-08 17:14:35 发布 · 7.6k 阅读

11 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#JSP #倒计时

jsp 专栏收录该内容

1 篇文章

订阅专栏

计算时间
<%
  long current_time=System.currentTimeMillis();//系统时间
  Date end_time5= DateUtil.toDate("2018-7-20 20:00:00");//设定的时间（此处可以直接得到long类型也可以，根据业务需求改变）
  long end_time = end_time5.getTime();
  long time=end_time-current_time;
 %>

  <script type="text/javascript">
    var second = <%= time / 1000%>; // 剩余秒数
    // 写一个方法，将秒数专为天数
    var toDays = function(){
         var s = second % 60; // 秒
         var mi = (second - s) / 60 % 60; // 分钟
         var h =  ((second - s) / 60 - mi ) / 60 % 24; // 小时
         var d =  (((second - s) / 60 - mi ) / 60 - h ) / 24; // 天
        return "剩余：" + d + "天" + h + "小时" + mi + "分钟" + s + "秒";
    };

    //然后写一个定时器
    $(document).ready(function(){//这一行是页面加载完成后，执行此定时器（也可以去掉）
    window.setInterval(function(){//定时器
         second --;
         document.getElementById("showTimes").innerHTML = toDays ();//写入到div中
    }, 1000);
    });
  </script>

  <div id="showTimes"></div>


页面效果：
![这里写图片描述](https://img-blog.csdn.net/20180720134732808?watermark/2/text/aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2x5czEyMjA=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70)