html 如何将倒计时器弹出窗口中的“天数”减少到30?

ctehm74n  于 2022-12-09  发布在  其他
关注(0)|答案(1)|浏览(124)

我用javascript代码在google的帮助下做了一个倒计时器弹出窗口,设置为100天后结束,经过多次尝试,我无法将其更改为30天。由于我是javascript新手,请帮助解决我的问题,我也想知道这背后的正确逻辑。
这是我所尝试的(结果为100天,以小时、分钟、秒为单位)

window.addEventListener("load", function(){
 setTimeout(
     function open(event){
         document.querySelector(".popup").style.display = "block";
     },
     2000
  )
});
  
document.querySelector("#close").addEventListener("click", function(){
        document.querySelector(".popup").style.display = "none";
});

const year = new Date().getFullYear();
const fourthOfJuly = new Date(year, 6, 4).getTime();
const fourthOfJulyNextYear = new Date(year + 1, 6, 4).getTime();
const month = new Date().getMonth();
// countdown 
let timer = setInterval(function () {
// get today's date
const today = new Date().getTime();
// get the difference
let diff;
if (month \> 6) {
  diff = fourthOfJulyNextYear - today;
} else {
  diff = fourthOfJuly - today;
}
// math
let days = Math.floor(diff / (1000 \* 60 \* 60 \* 24));
let hours = Math.floor((diff % (1000 \* 60 \* 60 \* 24)) / (1000 \* 60 \* 60));
let minutes = Math.floor((diff % (1000 \* 60 \* 60)) / (1000 \* 60));
let seconds = Math.floor((diff % (1000 \* 60)) / 1000);
// display

““”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“”“},1000);
我想让它显示30天,但怎么做呢?

pu82cl6c

pu82cl6c1#

你的代码会显示7月4日的倒计时。
你想显示一个倒计时到一个特定的日期或只是总是30天?
在间隔(大约每秒运行一次)中,将目标日期与当前日期进行比较,然后计算天数、小时数和分钟数。

const today = new Date()

// targetDate = today + 30 days
const targetDate = new Date();
targetDate.setDate(targetDate.getDate() + 30);

const diff = targetDate.getTime() - today.getTime()

您可以在此处找到工作版本:https://jsfiddle.net/6bhuywn4/26/

相关问题