Question

有人可以帮助我js / ajax倒计时我想要一个倒数计时器到10秒然后更新数据库并刷新页面一旦达到0。

我对javascript / ajax并不是很好，这是我到目前为止所做的：

var ss = 10;
function countdown() {
ss = ss-1;
if (ss<0) {
var url='update.php?countdown='+countdown;
}
else {
document.getElementById("countdown").innerHTML=ss;
window.setTimeout("countdown()", 1000);
}
}

<span id="countdown" style="color:green;">10</span>

和update.php文件，女巫工作正常：

if (isset($_REQUEST['countdown'])) {     
  mysql_query("INSERT INTO num (id, ad, active) 
  VALUES ('1', 'Test',1)") or die(mysql_error());
  }

这也是我发现的http://pastebin.com/Qwz3Zqtt，工作正常，但我不知道如何把它们放在一起。

任何帮助都将不胜感激。

由于

Answer 1

使用jQuery ajax

最简单的例子：

if (ss<0) {
    $.ajax('update.php?countdown='+countdown);
}

Answer 2

您将要学习基本的ajax来处理数据库请求。 jQuery有a very easy to use implementation。

基本代码可以是：

<script>
function updateTimer(seconds){
    var countdown = document.getElementById('countdown');
    countdown.innerHTML = "Please wait " + seconds + " seconds.";
}

var timer = function() {
    var seconds = 10;
    var interval = setInterval(function(){
        if (seconds <= 0){
            countdown.innerHTML = "Finished.. Updating Database";
            // AJAX request here
            clearInterval(interval);
        }else{
            updateTimer(seconds);            
            --seconds;
        }
    }, 1000);
    updateTimer(seconds);    
    --seconds;
}

document.getElementById('start').addEventListener('click', timer);
</script>

<div id="countdown"></div>
<button id="start">Click Me</button>

Here's a fiddle

javascript倒计时更新db并刷新

2 个答案: