JavaScript代码:
<script> window.onload = window.onload = function () { getTdValue(); } //根据传过来的天数(day)和日期(datatime),返回在传入日期上加上天数后的日期。如:day=2、datatime=2018/3/7 11:28:09,那么返回的日期就是2018/3/9 11:28:09 function showTime(day, datatime) { var dayTime = day * 24 * 60 * 60 * 1000; //参数天数的时间戳 var nowTime = new Date(datatime).getTime(); //当天的时间戳 var t = new Date(nowTime + dayTime).toString("yyyy/MM/dd HH:mm:ss"); //把两个时间戳转换成普通时间 return t; } function leftTimer(enddate) { var leftTime = (new Date(enddate)) - new Date(); //计算剩余的毫秒数 var days = parseInt(leftTime / 1000 / 60 / 60 / 24, 10); //计算剩余的天数 var hours = parseInt(leftTime / 1000 / 60 / 60 % 24, 10); //计算剩余的小时 var minutes = parseInt(leftTime / 1000 / 60 % 60, 10);//计算剩余的分钟 var seconds = parseInt(leftTime / 1000 % 60, 10);//计算剩余的秒数 days = checkTime(days); hours = checkTime(hours); minutes = checkTime(minutes); seconds = checkTime(seconds); if (days > 0 && hours >= 0 && minutes >= 0 && seconds >= 0) return days + "天" + hours + "小时" + minutes + "分" + seconds + "秒"; else if (days == 0 && hours >= 0 && minutes >= 0 && seconds >= 0) return hours + "小时" + minutes + "分" + seconds + "秒"; else if (days == 0 && hours == 0 && minutes >= 0 && seconds >= 0) return minutes + "分" + seconds + "秒"; else if (days <= 0 && hours <= 0 && minutes <= 0 && seconds <= 0) { return ""; } } function checkTime(i) { //将0-9的数字前面加上0,例1变为01 if (i < 10) { i = "0" + i; } return i; } function getTdValue() { var tableId = document.getElementById("tab"); var str = ""; //循环获取table for (var i = 1; i < tableId.rows.length; i++) { //tableId.rows[i].cells[4].innerHTML 获取table中第5个td的值 var date1 = new Date(), data2 = new Date(showTime(2, tableId.rows[i].cells[4].innerHTML)); if (data2 < date1) continue;//设置的时间小于现在时间退出 tableId.rows[i].cells[5].innerHTML = leftTimer(showTime(2, tableId.rows[i].cells[4].innerHTML)) tableId.rows[i].cells[5].style.color = "red";//改变td颜色 setInterval("getTdValue()", 1000);//每秒刷新一次 } } </script>
HTML代码:
<table style="width: 100%; height: 100%;" id="tab" border="1" cellpadding="1" cellspacing="1"> <tr style="background-color: #CCC;"> <th>学号</th> <th>姓名</th> <th>性别</th> <th>年龄</th> <th>入学时间</th> <th>倒计时</th> </tr> <tr> <td>1</td> <td>李斯</td> <td>男</td> <td>22</td> <td>2018/2/8 11:28:09</td> <td>已入学</td> </tr> <tr> <td>2</td> <td>王倩</td> <td>女</td> <td>20</td> <td>2018/3/7 11:28:09</td> <td>已入学</td> </tr> <tr> <td>3</td> <td>于谦</td> <td>男</td> <td>18</td> <td>2018/3/8 13:28:09</td> <td>已入学</td> </tr> <tr> <td>4</td> <td>柳浪</td> <td>女</td> <td>19</td> <td>2018/3/8 11:40:20</td> <td>已入学</td> </tr> <tr> <td>5</td> <td>诸葛亮</td> <td>男</td> <td>20</td> <td>2018/3/8 12:30:39</td> <td>已入学</td> </tr> <tr> <td>6</td> <td>东方云</td> <td>女</td> <td>21</td> <td>2018/3/8 11:45:20</td> <td>已入学</td> </tr> <tr> <td>7</td> <td>公孙策</td> <td>男</td> <td>22</td> <td>2018/3/8 11:50:59</td> <td>已入学</td> </tr> <tr> <td>8</td> <td>宝清</td> <td>女</td> <td>23</td> <td>2018/3/8 13:28:47</td> <td>已入学</td> </tr> <tr> <td>9</td> <td>智育</td> <td>男</td> <td>20</td> <td>2018/3/8 13:08:09</td> <td>已入学</td> </tr> <tr> <td>10</td> <td>柳丝丝</td> <td>女</td> <td>21</td> <td>2018/3/8 14:28:09</td> <td>已入学</td> </tr> </table>
原文地址:https://www.cnblogs.com/strive-boy/p/8533224.html
时间: 2024-10-07 15:56:32