Question

我正在尝试编写一个计时器功能。在第一个状态，计时器工作，但它执行的代码必须分别放在goActive/goInactive函数内的计时器内。现在我试图通过让goActive/goInactive返回很少的信号变量来将定时器与函数调用分开，其他代码块可以解释这些变量。

现在我刚刚做了一个简单的模型。我希望goActive和goInactive返回1或-1，然后另一个函数checktimer应该在更新时将它们写入屏幕。但我没有想出逻辑。我是JS的新手;我感谢所有的帮助：

var TimeoutID;
var timerstatus = 0;

function inputdetect() {
  // attaches event handler to specified event
  // takes event as string, function to run, and optional boolean
  // to indicate when the event propogates
  // these are false, so events "bubble up"
  this.addEventListener("mousemove", resetTimer, false);
  this.addEventListener("mousedown", resetTimer, false);
  this.addEventListener("mousewheel", resetTimer, false);
  this.addEventListener("keypress", resetTimer, false);
  this.addEventListener("touchmove", resetTimer, false);
  this.addEventListener("DOMmousescroll", resetTimer, false);
  this.addEventListener("MSpointermove", resetTimer, false);

  startTimer();
}

inputdetect();

function startTimer() {
  //waits two seconds before calling inactive
  TimeoutID = window.setTimeout(goInactive, 2000); // does it need to take the window variable??
}

function resetTimer(e) {
  window.clearTimeout(TimeoutID);
  goActive();
}

function goActive() {
  //what happens when the UI is not idle

  $('#hi').text("The UI is not idle.");
  timerstatus = 1;
  $('#var').text(timerstatus);

  startTimer();
  return timerstatus;
}

function goInactive() {
  $('#hi').text("The UI is idle.");
  timerstatus = -1;
  $('#var').text(timerstatus);
  return timerstatus;
  // REPLACING CURSOR WHEN UI IS IDLE
  //this part won't work
}

function checktimer(timerstatus) {
  $('#ct').text(timerstatus);
}

$(document).ready(function() {
  window.setInterval(checktimer(timerstatus), 2000);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<div>check timer update goes: <span id="ct"></p></div>

<!--this is where the HTML will go*/-->
<p id = "hi">hello</p>
<p id = "ts">Timer status is: <span id = "var"></span> 
  </p>

Answer 1

这是不正确的。

window.setInterval(checktimer(timerstatus), 2000);

您需要传递函数而不是调用函数。

由于timerstatus是一个全局变量，它已经被所有函数共享，因此您不需要传递和返回它。所有功能都可以使用它。

所以只需将checktimer传递给setInterval。

window.setInterval(checktimer, 2000);

删除所有return timerstatus;行，并删除checktimer的参数：

function checktimer() {
  $('#ct').text(timerstatus);
}

我不知道这是否符合您最终的要求，但它确实纠正了代码。

写功能不读取计时器

1 个答案: