De code:
<!DOCTYPE html>
<HEAD>
<TITLE>Count Down Timer</TITLE>
<style>
input[type=submit] {
padding:5px 15px;
background:red;
color:#ffffff;
border:0 none;
cursor:pointer;
-webkit-border-radius: 5px;
border-radius: 5px;
}
input[type=text] {
background:aliceblue;
color:green;
font-weight: bold;
}
textarea {
background:aliceblue;
color:green;
font-weight: bold;
}
h1 {
color:red;
}
</style>
<SCRIPT>
var running = false
var endTime = null
var timerID = null
function startTimer(duration) {
running = true
now = new Date()
now = now.getTime()
// change last multiple for the number of minutes
endTime = now + (1000 * 60 * duration)
showCountDown()
document.getElementById("submit").disabled = true
}
function showCountDown() {
var now = new Date()
now = now.getTime()
if (endTime - now <= 0) {
stopTimer('Einde')
formSubmit()
// of alert("Time is up. Put down your pencils.")
} else {
var delta = new Date(endTime - now)
var theMin = delta.getMinutes()
var theSec = delta.getSeconds()
var theHour = delta.getHours() -1
var theTime = ((theMin < 10) ? "0" : "") + theMin
theTime += ((theSec < 10) ? ":0" : ":") + theSec
document.forms[0].timerDisplay.value = "resttijd: "+ ((theHour<1) ? "0":theHour) + ":" +theTime
if (running) {
timerID = setTimeout("showCountDown()",1000)
}
}
}
function stopTimer(status) {
clearTimeout(timerID)
running = false
document.forms[0].timerDisplay.value = status
document.getElementById("submit").disabled = false
}
function formSubmit() {
//activate submit button
document.getElementById("submit").disabled = false;
//and submit form
document.getElementById("MyForm").submit();
}
</SCRIPT>
</HEAD>
<BODY>
<center>
<h2>Artikel plaatsen</h2>
</center>
<FORM name="MyForm" id=MyForm" action="PlaatsArtikel.php" onkeypress="return event.keyCode != 13;">
<center>
Kopzin<br>
<INPUT TYPE="text" NAME="KopArtikel" PLACEHOLDER="Kopzin" SIZE="100" required ><br><br>
Tekst<br>
<TEXTAREA ROWS="8" COLS="100" NAME="BodyArtikel" PLACEHOLDER="Tekst" required></TEXTAREA>
<br><hr width="65%">
Klik "verstuur nu" of klik op een van onderstaande knoppen voor uitgesteld verzenden.<br>
<INPUT TYPE="button" NAME="startTime" VALUE="1 minuut" onClick="startTimer(1)">
<INPUT TYPE="button" NAME="startTime" VALUE="1 uur" onClick="startTimer(60)">
<INPUT TYPE="button" NAME="startTime" VALUE="3 uur" onClick="startTimer(180)">
<INPUT TYPE="button" NAME="startTime" VALUE="6 uur" onClick="startTimer(360)">
<INPUT TYPE="button" NAME="startTime" VALUE="9 uur" onClick="startTimer(540)">
<INPUT TYPE="button" NAME="startTime" VALUE="12 uur" onClick="startTimer(720)">
<br><br>
<INPUT TYPE="button" NAME="clearTime" VALUE="Stop Timer" onClick="stopTimer('Gestopt!')" style="color:red;">
<INPUT TYPE="text" NAME="timerDisplay" VALUE="00:00" Size="17">
<br><br><hr width="65%"><center>
<INPUT TYPE="submit" id="submit" NAME="submit" Value="Verstuur Nu" >
</form>
</FORM>
</BODY>
</HTML>
Graag jullie hulp.
