代码:

<!DOCTYPE html>
<html>
<head>
<title>多个timeout</title>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
</head>
<body>
<div>
<h5 class="text-success">倒计</h5>
<!-- 已结束 -->
<p id="order_time_1" data-id="" data-starttime="2019-12-01 11:59:59" data-endtime="2020-02-02 11:30:59"
class="remain-time">已结束</p>
<!-- 距多少开始 -->
<p id="order_time_2" data-id="" data-starttime="2019-12-08 11:30:00" data-endtime="2020-03-20 12:00:00"
class="remain-time">距多少开始</p>
<!-- 距多少开始 -->
<p id="order_time_22" data-id="" data-starttime="2019-12-01 16:42:30" data-endtime="2020-03-20 12:00:00"
class="remain-time">距多少开始3</p> <!-- 距多少结束 -->
<p id="order_time_3" data-id="" data-starttime="2019-12-01 23:59:59" data-endtime="2020-03-10 23:59:59"
class="remain-time">距多少结束</p>
<!-- 距多少结束 -->
<p id="order_time_33" data-id="" data-starttime="2019-12-01 23:59:59" data-endtime="2020-03-1 16:44:00"
class="remain-time">距多少结束3</p>
</div> <script type="text/javascript">
var jsq = {
startdata: [],
enddata: [],
addStart: function (key, value) {
if (typeof (jsq.startdata[key]) == 'undefined') {
jsq.startdata[key] = value;
}
},
addEnd: function (key, value) {
if (typeof (jsq.enddata[key]) == 'undefined') {
jsq.enddata[key] = value;
}
},
addAll: function () {
$(".remain-time").each(function (i) {
var key = $(this).attr("data-id");
var startValue = $(this).attr("data-starttime");
var endValue = $(this).attr("data-endtime");
//添加计时元素
if (typeof (jsq.startdata[key]) == 'undefined') {
jsq.addStart(key, startValue);
jsq.addEnd(key, endValue);
}
});
//执行检测
jsq.subAll();
},
subAll: function () {
for (var index in jsq.startdata) {
var nowTime = new Date();
var startTime = new Date(jsq.startdata[index].toString().replace(/-/g, '/'));
var endTime = new Date(jsq.enddata[index].toString().replace(/-/g, '/')); var S_timestamp = startTime.getTime() - nowTime.getTime();
var E_timestamp = endTime.getTime() - nowTime.getTime(); //console.log(startTime);
if (E_timestamp <= ) //小1秒
{
$('#order_time_' + index).text('已结束 >' + jsq.enddata[index].toString());
$('#order_time_' + index).css("color", "red");
//$("#order_time_" + key).parent().parent().parent().parent().remove(); //删除
}
else if (E_timestamp > && S_timestamp >= ) //大1秒
{
//提取时间元素
var _day = Math.floor(S_timestamp / / / / );
var _hour = Math.floor(S_timestamp / / / % );
var _min = Math.floor(S_timestamp / / % );
var _sec = Math.floor(S_timestamp / % ); if (_hour < ) {
_hour = "" + _hour;
}
if (_min < ) {
_min = "" + _min;
}
if (_sec < ) {
_sec = "" + _sec;
}
$('#order_time_' + index).text(_day + "天" + _hour + "时" + _min + "分" + _sec + "秒" + "开始");
}
else {
//提取时间元素
var _day = Math.floor(E_timestamp / / / / );
var _hour = Math.floor(E_timestamp / / / % );
var _min = Math.floor(E_timestamp / / % );
var _sec = Math.floor(E_timestamp / % ); if (_hour < ) {
_hour = "" + _hour;
}
if (_min < ) {
_min = "" + _min;
}
if (_sec < ) {
_sec = "" + _sec;
}
$('#order_time_' + index).text(_day + "天" + _hour + "时" + _min + "分" + _sec + "秒" + "结束");
}
}
}
}; $(function () {
//倒计时
setInterval('jsq.addAll()', );
});
</script>
</body> </html>

最新文章

  1. 自定义 Material Design风格的提示框
  2. Asp.net 网站防攻击安全设置
  3. Android基础总结(10)——手机多媒体的运用:通知、短信、相机、视频播放
  4. git pull使用【转】
  5. Old Calculator
  6. *[topcoder]JumpFurther
  7. Android 实用代码七段(二)
  8. ajax+FormData+javascript 实现无刷新表单注册
  9. Delphi事件列表赏析(38个事件,必须要对这些事件非常熟悉,才能如臂使指,才能正确发布到新控件!)
  10. 私有静态方法private static method-值得用吗?
  11. 玩转Web之Json(四)---json与(Object/List/Map)的相互转化
  12. Linux系统(五)负载均衡LVS集群之DR模式
  13. [Linux] PHP程序员玩转Linux系列-Linux和Windows安装nginx
  14. 在react.js上使用antd-design没有样式
  15. CodeM美团点评编程大赛初赛B轮 黑白树【DFS深搜+暴力】
  16. .Net语言 APP开发平台——Smobiler学习日志:如何在手机上快速实现CandleStickChart控件
  17. Spark Streaming和Kafka整合保证数据零丢失
  18. ****** 二十八 ******、软设笔记【数据库】-分布式数据库、特点、数据存储、DBMS组成
  19. Oracle Database 11g : SQL 基础
  20. 本机连接Spark Standalone--最简单的spark调试方式

热门文章

  1. 【HCIA Gauss】学习汇总-数据库管理(事务 权限 审计 OBDC JDBC)-6
  2. Docker基础用法篇
  3. Linux-网络RAID技术DRBD
  4. SQL之CASE WHEN用法详解(转)
  5. 与你一起学习MS Project&mdash;&mdash;理论篇:项目管理与Project
  6. $().on()的知识点
  7. django-文件上传和下载--fastDFS安装和配置
  8. nginx 配置文件正确性测试
  9. ES6函数的个人总结
  10. LeetCode 971. Flip Binary Tree To Match Preorder Traversal