StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POJavascript timer help needed
text
Body
copied!<p>I have the following ajax page. The form should be submitted and the timer should be restart counting down when the timer expires or button is clicked.<br> For some reason the timer is not reset and goes minus. Can someone tell me how to fix this? </p> <p>(The code is standalone, you can copy/paste ans test it, then run it on server) </p> <p><strong><code>test.htm:</code></strong></p> <pre><code> <html> <head> <script type="text/javascript" src="http://mootools.net/download/get/mootools-core-1.3-full-compat.js"></script> </head> <body> <div id="container"> <form id="form" name="form" action="test.htm" method="post"> Remaining time: <input type="text" name="clock" size="4">seconds <input type="submit" value="submit" ID="questionSubmit"> </form> <script type="text/javascript"> var timeLeft = 10; function startClock() { timeLeft--; document.form.clock.value = timeLeft; if(timeLeft == 0) { sendForm(); } else { setTimeout("startClock()", 1000); } } setTimeout("startClock()", 1000); </script> <script type="text/javascript"> function handleSubmit(e) { e = new Event(e).stop(); sendForm(); } function sendForm() { $('form').set('send', {onComplete: function(response) { $('container').set('html', response); $('questionSubmit').addEventListener('click', handleSubmit, false); setTimeout("startClock()", 1000); }}); //Send the form. $('form').send(); } $('questionSubmit').addEventListener('click', handleSubmit, false); </script> </div> </body> </html> </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload