APEX日期之间的倒计时计时器

Question

我正在尝试使用以下代码显示结束日期/时间列和系统日期/时间栏之间的倒计时计时器。它没有显示计时器。

我创建了一个页面项目P3_TIMER，它有一个列P3_STARTDATE。

var timer;
var endDate = new Date();
endDate.setDate(endDate.getDate()); //End date is the sys date
timer = setInterval(function() {
timeBetweenDates(endDate);
}, 1000);
function timeBetweenDates(toDate) {
var dateEntered = :P3_STARTDATE;
var now = new Date();
var difference = dateEntered.getTime() - now.getTime();
if (difference <= 0) {
// Timer done
clearInterval(timer);

} else {

var seconds = Math.floor(difference / 1000);
var minutes = Math.floor(seconds / 60);
var hours = Math.floor(minutes / 60);
var days = Math.floor(hours / 24);
hours %= 24;
minutes %= 60;
seconds %= 60;
$("#days").text(days);
$("#hours").text(hours);
$("#minutes").text(minutes);
$("#seconds").text(seconds);
}
$s('P3_TIMER',timer);
}

Answer 1

不能将pl/sql和javascript混合使用。它们是不同的语言，在不同的环境中运行。

function timeBetweenDates(toDate) {
var dateEntered = :P3_STARTDATE; >>> This is pl/sql 
var now = new Date();

P3_STARTDATE需要转换为javascript日期对象。这不能直接进行，需要进行一些解析，如本线程所示。

对于下面的示例，假设日期是以DD-MON-YYYY格式传递的。

var timer;
var endDate = new Date();
endDate.setDate(endDate.getDate()); //End date is the sys date
timer = setInterval(function() {
timeBetweenDates(endDate);
}, 1000);
function parseDate(s) {
var months = {jan:0,feb:1,mar:2,apr:3,may:4,jun:5,
jul:6,aug:7,sep:8,oct:9,nov:10,dec:11};
var p = s.split('-');
return new Date(p[2], months[p[1].toLowerCase()], p[0]);
}
function timeBetweenDates(toDate) {
var dateEntered = parseDate(apex.item( "P63_DATE" ).getValue() );
var now = new Date();
var difference = dateEntered.getTime() - now.getTime();
if (difference <= 0) {
// Timer done
clearInterval(timer);

} else {

var seconds = Math.floor(difference / 1000);
var minutes = Math.floor(seconds / 60);
var hours = Math.floor(minutes / 60);
var days = Math.floor(hours / 24);
hours %= 24;
minutes %= 60;
seconds %= 60;
$("#days").text(days);
$("#hours").text(hours);
$("#minutes").text(minutes);
$("#seconds").text(seconds);
}
apex.item("P63_TIMER").setValue(`Days: ${days}, Hours: ${hours}, Minutes: ${minutes}, Seconds: ${seconds}`);
}