Javascript中的倒数计时器，仅包含天，小时，分钟 - 摆脱秒
在我刚刚开始学习的javascript方面，我是一个新手。我一直在尝试为我的网站编写计时器，我发现了一些有助于这样做的代码，但我想摆脱秒的显示。
这是我正在使用的脚本代码：
const total = Date.parse(endtime) - Date.parse(new Date());
const seconds = Math.floor((total / 1000) % 60);
const minutes = Math.floor((total / 1000 / 60) % 60);
const hours = Math.floor((total / (1000 * 60 * 60)) % 24);
const days = Math.floor(total / (1000 * 60 * 60 * 24));
return {
total,
days,
hours,
minutes,
seconds
};
}
function initializeClock(id, endtime) {
const clock = document.getElementById(id);
const daysSpan = clock.querySelector('.days');
const hoursSpan = clock.querySelector('.hours');
const minutesSpan = clock.querySelector('.minutes');
const secondsSpan = clock.querySelector('.seconds');
function updateClock() {
const t = getTimeRemaining(endtime);
daysSpan.innerHTML = t.days;
hoursSpan.innerHTML = ('0' + t.hours).slice(-2);
minutesSpan.innerHTML = ('0' + t.minutes).slice(-2);
secondsSpan.innerHTML = ('0' + t.seconds).slice(-2);
if (t.total <= 0) {
clearInterval(timeinterval);
}
}
updateClock();
const timeinterval = setInterval(updateClock, 1000);
}
const deadline = new Date(Date.parse(new Date()) + 30 * 24 * 60 * 60 * 1000);
initializeClock('clockdiv', deadline);
这是与之关联的 html 代码：
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Timer</title>
<link rel = "stylesheet"
type = "text/css"
href = "style.css" />
<script src="javascript.js" defer></script>
</head>
<body>
<h1>Preorders end in:</h1>
<div id="clockdiv">
<div>
<span class="days"></span>
<div class="smalltext">Days</div>
</div>
<div>
<span class="hours"></span>
<div class="smalltext">Hours</div>
</div>
<div>
<span class="minutes"></span>
<div class="smalltext">Minutes</div>
</div>
<div>
<span class="seconds"></span>
<div class="smalltext">Seconds</div>
</div>
</div>
</body>
</html>
有没有可能对此有一个快速解决方案？
有只小跳蛙1回答
-
临摹微笑
在 Java 脚本中，删除所有处理 和 的行。在 HTML 中，删除 中的最后一个 。secondssecondsSpan<div><div id="clockdiv">这将给你留下：断续器function getTimeRemaining(endtime) { const total = Date.parse(endtime) - Date.parse(new Date()); const minutes = Math.floor((total / 1000 / 60) % 60); const hours = Math.floor((total / (1000 * 60 * 60)) % 24); const days = Math.floor(total / (1000 * 60 * 60 * 24)); return { total, days, hours, minutes };}function initializeClock(id, endtime) { const clock = document.getElementById(id); const daysSpan = clock.querySelector('.days'); const hoursSpan = clock.querySelector('.hours'); const minutesSpan = clock.querySelector('.minutes'); function updateClock() { const t = getTimeRemaining(endtime); daysSpan.innerHTML = t.days; hoursSpan.innerHTML = ('0' + t.hours).slice(-2); minutesSpan.innerHTML = ('0' + t.minutes).slice(-2); if (t.total <= 0) { clearInterval(timeinterval); } } updateClock(); const timeinterval = setInterval(updateClock, 1000);}const deadline = new Date(Date.parse(new Date()) + 30 * 24 * 60 * 60 * 1000);initializeClock('clockdiv', deadline);断续器<head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Timer</title> <link rel="stylesheet" type="text/css" href="style.css" /> <script src="javascript.js" defer></script></head><body> <h1>Preorders end in:</h1> <div id="clockdiv"> <div> <span class="days"></span> <div class="smalltext">Days</div> </div> <div> <span class="hours"></span> <div class="smalltext">Hours</div> </div> <div> <span class="minutes"></span> <div class="smalltext">Minutes</div> </div> </div></body></html>
随时随地看视频慕课网APP
相关分类
JavaScript