javascript倒计时计时器删除小时、分钟、秒..过期后
javascript倒计时计时器删除小时、分钟、秒..过期后
提问于 2018-07-03 04:24:12
我对javascript非常陌生，我不知道如何删除我的倒计时的过期部分。例如，当倒计时完成对天的计数时，它将删除天，然后将删除小时，依此类推，直到到达“过期”点。
下面是JS代码：
var items = document.querySelectorAll('#clock');
for (var i = 0, len = items.length; i < len; i++) {
(function () {
var e = new Date("2018-12-31").getTime(),
t = this.querySelector("[data-js=countdown]"),
n = this.querySelector("[data-js=countdown-endtext]"),
day = this.querySelector("[data-js=countdown-day]"),
hour = this.querySelector("[data-js=countdown-hour]"),
min = this.querySelector("[data-js=countdown-minute]"),
sec = this.querySelector("[data-js=countdown-second]"),
s = this.gjs_countdown_interval;
s && s && clearInterval(s);
var l = function (e, t, n, s) {
day.innerHTML = e < 10 ? "0" + e : e,
hour.innerHTML = t < 10 ? "0" + t : t,
min.innerHTML = n < 10 ? "0" + n : n,
sec.innerHTML = s < 10 ? "0" + s : s
},
u = function () {
var day = (new Date).getTime(),
hour = e - day,
min = Math.floor(hour / 864e5),
sec = Math.floor(hour % 864e5 / 36e5),
s = Math.floor(hour % 36e4 / 6e4),
u = Math.floor(hour % 6e4 / 1e3);
l(min, sec, s, u), hour < 0 && (clearInterval(c),
n.innerHTML = "EXPIRED",
t.style.display = "none",
n.style.display = "")
};
if (e) {
var c = setInterval(u, 1e3);
this.gjs_countdown_interval = c,
n.style.display = "none",
t.style.display = "", u()
} else l(0, 0, 0, 0)
}.bind(items[i]))();
}HTML：
<section class="flex-sect">
<div id="clock" class="countdown">
<span data-js="countdown" class="countdown-cont">
<div class="countdown-block">
<div data-js="countdown-day" class="countdown-digit"></div>
<div class="countdown-label">days</div>
</div>
<div class="countdown-block">
<div data-js="countdown-hour" class="countdown-digit"></div>
<div class="countdown-label">hours</div>
</div>
<div class="countdown-block">
<div data-js="countdown-minute" class="countdown-digit"></div>
<div class="countdown-label">minutes</div>
</div>
<div class="countdown-block">
<div data-js="countdown-second" class="countdown-digit"></div>
<div class="countdown-label">seconds</div>
</div>
</span>
<span data-js="countdown-endtext" class="countdown-endtext"></span>
</div>
</section>非常感谢你们的帮助
回答 2
Stack Overflow用户
回答已采纳
发布于 2018-07-11 01:23:12
最后，我能够修复我的错误，这就是我是如何做到的:代替{{ request.GET.date }} GMT-7，给出你的参数，它工作得很好！
<script>
var deadline = new Date("{{ request.GET.date }} GMT-7").getTime();
var x = setInterval(function () {
var now = new Date().getTime();
var t = deadline - now;
var days = Math.floor(t / (1000 * 60 * 60 * 24));
var hours = Math.floor((t % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((t % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((t % (1000 * 60)) / 1000);
if (days == 0) {
document.getElementById("day").innerHTML = '';
document.getElementById("day-title").innerHTML = '';
} else if (days ==1) {
document.getElementById("day-title").innerHTML = 'Day';
document.getElementById("day").innerHTML = days;
} else {
document.getElementById("day").innerHTML = days;
document.getElementById("day-title").innerHTML = 'Days';
}
if (hours != 0) {
document.getElementById("hour").innerHTML = hours;
} else {
document.getElementById("hour").innerHTML = '';
document.getElementById("hour-title").innerHTML = '';
}
document.getElementById("minute").innerHTML = minutes;
document.getElementById("second").innerHTML = seconds;
if (t < 0) {
clearInterval(x);
document.getElementById("clock").innerHTML = '';
}
}, 1000);
</script>
Stack Overflow用户
发布于 2018-07-03 06:00:05
您可以检查时间段是否为0，以及所有较大的时间段是否也为0。
if (day == 0) {
day.innerHTML = "";
}
if (day == 0 && hour == 0) {
hour.innerHTML = "";
}
if (day == 0 && hour == 0 && min == 0) {
min.innerHTML = "";
}
if (day == 0 && hour == 0 && min == 0 && sec == 0) {
sec.innerHTML = "";
n.innerHTML = "Expired";
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51143274
复制相关文章
相似问题
腾讯云开发者
