Question

我正在尝试按照jsfiddle示例在javascript中创建时间：

现在显然jsfiddle中的计时器工作正常。但我遇到的问题是计时器启动的时间来自mysqli / php变量，它从数据库中检索时间。

所以除了：

<span id="countdown">01:30:10</span>

我必须把它作为：

echo "<p><span id='countdown'>" . $dbSessionDuration . "</span></p>";

和

除了：

var time = "01:30:10",

我必须把它作为：

var time = <?php echo json_encode($dbSessionDuration); ?>,

现在我没有错误，但发生的事情是计时器没有倒计时。我的问题是为什么不算倒数？变量的时间示例可以是01:00:00。

以下是该功能的代码：

echo "<p><span id='countdown'>" . $dbSessionDuration . "</span></p>";


...

         <script type="text/javascript">


    (function(){
  $(document).ready(function() {
    var time = <?php echo json_encode($dbSessionDuration); ?>,
      parts = time.split(':'),
      hours = +parts[0],
      minutes = +parts[1],
      seconds = +parts[2],
      span = $('#countdown');

    function correctNum(num) {
      return (num<10)? ("0"+num):num;
    }

    var timer = setInterval(function(){
        seconds--;
        if(seconds == -1) {
            seconds = 59;
            minutes--;

            if(minutes == -1) {
                minutes = 59;
                hours--;

                if(hours==-1) {
                  alert("timer finished");
                  clearInterval(timer);
                  return;
                }
            }
        }
        span.text(correctNum(hours) + ":" + correctNum(minutes) + ":" + correctNum(seconds));
    }, 1000);
  }); 
});

</script>

Answer 1

我不知道这是不是错误，但是我能够通过在匿名函数的第一部分添加$，$(function(){来运行此代码。我假设你的db值来自几小时：分钟：秒。我不确定为什么Fiddler会跑，但我必须添加它才能让它在我的环境中运行。

Answer 2

改变这个：

  }); 
});

</script>

到此：

  }); 
})();            //  ←  note the extra parentheses

</script>

这样你实际上调用你的匿名函数。（或者，您可以完全删除其(function(){和});。此代码根本没有理由在函数中。）

从db中检索时间时javascript计时器不倒计时

2 个答案: