javascript倒计时和更新数据库php

Question

I would like to implement a JavaScript code to count down hundred seconds. I have written the code for count down, but I need the value of the remaining time and update it in a database on every second. Below is an example of what I would like to accomplish:

On Every second I would like to run:

UPDATE 'table' SET 'timeleft=[remaining time]'

Is this possible?

Below is what I've tried so far:

<? $time = "100"; ?>

<script>
var intCountDown = <?php echo $time; ?>;

function countDown()
{
    if(intCountDown < 0)
    {
        cntdwn.innerText = 'Done';
        return;
    }

    cntdwn.innerText = intCountDown--;

    setTimeout("countDown()",1000);
}
</script>

Then just: <div id=cntdwn></div>

Additionally this may help clarify my intention: I want to implement a single-shot timer but prefer the counter to overflow back to where it started after the page refresh.

Answer 1

To do that, you'll need AJAX:

here is your AJAX function:

function loadXMLDoc(timeleft)
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    cntdwn.innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","update.php?timeleft="+timeleft,true);
xmlhttp.send();
}

Using above function, we can send an int to update.php?timeleft= and update.php should connect to database and update your timeleft value (i think you wrote it anyway). and in your countdown function just replace this line:

cntdwn.innerText = intCountDown--;

with this(since we will update innerText in ajax call):

intCountDown--;

that's all needs to be done