javascript - 使用相同的函数创建多个对象

标签 javascript jquery

我有一个倒数到 0 的计时器。它可以正常工作,但我想在同一页面上创建第二个计时器。我可以创建第二个计时器,但它不会倒计时,并且第一个计时器的倒计时速度是第一个计时器的两倍。我该怎么做呢。这是我的代码

<script>
var Timer;
var TotalSeconds;

function CreateTimer(TimerID, Time) {
  Timer = document.getElementById(TimerID);
  TotalSeconds = Time;
  UpdateTimer()
  window.setTimeout("Tick()", 1000);
}

function Tick() {
  if(TotalSeconds <= 0) {
    TotalSeconds = 0;
    return;
  }

  TotalSeconds -= 1;
  UpdateTimer()
  window.setTimeout("Tick()", 1000);
}

function UpdateTimer() {
  var Seconds = TotalSeconds;
  var Days = Math.floor(Seconds / 86400);
  Seconds -= Days * 86400;
  var Hours = Math.floor(Seconds / 3600);
  Seconds -= Hours * (3600);
  var Minutes = Math.floor(Seconds / 60);
  Seconds -= Minutes * (60);
  var TimeStr = ((Days > 0) ? Days + " days " : "") + LeadingZero(Hours) + ":" + LeadingZero(Minutes) + ":" + LeadingZero(Seconds)
  Timer.innerHTML = TimeStr;
}

function LeadingZero(Time) {
  return(Time < 10) ? "0" + Time : +Time;
}
</script>

<?php 
$tomorrow  = mktime(0, 0, 0, date("m")  , date("d")+1, date("Y"));
$currentTime = time();
$today = $tomorrow - $currentTime;
?>

<div id="timer"></div>

<script type="text/javascript">
  var today = <?php echo $today; ?>
  window.onload = CreateTimer("timer", today);
</script>

<div id="timer2"></div>

<script type="text/javascript">
  var today = <?php echo $today; ?>
  window.onload = CreateTimer("timer2", today);
</script>

最佳答案

其滴答速度加快两倍的原因是因为两个倒计时共享相同的 TotalSeconds 变量。

关于javascript - 使用相同的函数创建多个对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15260699/

相关文章:

javascript - 删除带有空 src 的图像标签

javascript - 如何使用 JavaScript 和 CSS 从循环文本创建链接?

javascript - 不可变的js修改所有嵌套记录

javascript - 如何将 twilio 集成到 react native for android 中?

javascript - 与 Sequelize 的关联

jquery - 在 native 不支持它的浏览器中模拟 "placeholder"属性的最准确方法是什么?

jquery - Fullcalendar:如何隐藏过去重复的背景事件?

javascript - Ajax上传文件: $_FILES is empty but files exists in request header

javascript - 莫名其妙的 "Undefined is not a function"错误 — 由 "getElementsById"引起

javascript - 多个设备的图像响应?