[英]Creating a dynamic javascript countdown timer
I'm looking to create a dynamic javascript countdown timer, I want to pass it a datetime variable from my SQL server database and have it count down to this date then display a message, I've tried nearly every JQuery plugin I can find and Havent been able to edit them to do what I need, I also need to be able to have multiple countdown timers on the same page, 我正在寻找一个动态的JavaScript倒数计时器,我想从SQL Server数据库中传递一个datetime变量,并将其倒数到该日期,然后显示一条消息,我已经尝试了几乎所有可以找到的JQuery插件, Havent能够编辑它们以执行我需要的操作,我还需要能够在同一页面上具有多个倒数计时器,
Any help would be much appriciated 任何帮助将不胜感激
Cheers 干杯
Scott 史考特
=======EDIT======= =======编辑=======
After much Trial and Error I was able to modify this js http://andrewu.co.uk/clj/countdown/pro/ 经过多次试验和错误,我能够修改此js http://andrewu.co.uk/clj/countdown/pro/
to do what I needed 做我需要的
try this: 尝试这个:
function Thick(startin) {
startin--;
document.getElementById('timer').innerHTML = startin;
if(startin > 0) setTimeout('Thick(' + startin + ')', 1000);
}
call thus function in body onLoad like: 因此在body onLoad中调用函数,例如:
<body onLoad="Thick(20);">
hope this help :) 希望这个帮助:)
//TODAY'S DATE
$today = time();
//FETCHES DATE AND TIME FOR THE EVENT FROM DATABASE
$sql = "SELECT * FROM post";
$result = mysqli_query($conn, $sql);
if (mysqli_num_rows($result) > 0) {
$Row = (mysqli_fetch_assoc($result));
$th = $Row['endtime'];
}
echo $th
first of all put it into a variable then use your javascript to call the variable
//let get todays date here
var today = new Date();
var DD = today.getDate();
var MM = today.getMonth()+1; //January is 0!
var YYYY = today.getFullYear();
//let get the Difference in Sec btw the two dates
var _DateFromDBProgEndDate = '<?php echo $th; ?>';
var ProgEndTime = new Date(_DateFromDBProgEndDate);
var TodayTime = new Date();
var differenceTravel = ProgEndTime.getTime()- TodayTime.getTime() ;
var seconds = Math.floor((differenceTravel) / (1000));
////////////////////////////////
var SecDiffFromToday = seconds;
var seconds = SecDiffFromToday;
function timer() {
var days = Math.floor(seconds/24/60/60);
var hoursLeft = Math.floor((seconds) - (days*86400));
var hours = Math.floor(hoursLeft/3600);
var minutesLeft = Math.floor((hoursLeft) - (hours*3600));
var minutes = Math.floor(minutesLeft/60);
var remainingSeconds = seconds % 60;
if (remainingSeconds < 10) {
remainingSeconds = "0" + remainingSeconds;
}
document.getElementById('countdown').innerHTML = days + ":" + hours + ":" + minutes + ":" + remainingSeconds;
if (seconds == 0) {
clearInterval(countdownTimer);
document.getElementById('countdown').innerHTML = "Completed";
} else {
seconds--;
}
}
var countdownTimer = setInterval('timer()', 1000);
</script>
the javascript call in the variable with '<?php echo $th; ?>'; then the javascript does the count down with out refreshing the page
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.