Question

我有一个功能，每次单击按钮都会连续重置，但是，当屏幕上显示某张图片时，我试图清除该计时器。程序中还有很多事情在进行，但这是我遇到的普遍问题。这是我到目前为止的内容：

JavaScript：

function reset() {
  var f = document.getElementById("ff").onclick;
  var ft = setTimeout(function(){ dontf() }, 3000);
  f = ft;
}

function dontf() {
  document.getElementById("r").src="H.jpg";
}

function s() {
  if (document.getElementById("r").src == "file:///C:/Users/S.jpg") {
    clearTimeout(ft);
  }
}

HTML

<button onclick="reset(); s();" id="ff">Fd</button>

Answer 1

你可以看看这个伴侣

您需要做的就是在dontf和s功能都可以访问的范围内定义var ft

let timer;        
function reset() {
  const element = document.getElementById("resetButton");
  timer = setTimeout(function(){ addImageFunc() }, 3000);
}

function addImageFunc() {
console.log(timer); document.getElementById("addImage").src="https://images.pexels.com/photos/248797/pexels-photo-248797.jpeg?auto=compress&cs=tinysrgb&h=350";
}

function stopReset() {
  if (document.getElementById("addImage").src == "https://images.pexels.com/photos/248797/pexels-photo-248797.jpeg?auto=compress&cs=tinysrgb&h=350") {
    clearTimeout(timer);
  }
}

<html>
<body>
  <button onclick="reset(); stopReset();" id="resetButton">Fd</button>
  <img id='addImage'>
</body>
</html>

建议

对变量和函数使用正确的命名约定，这将使您的代码更具可读性并易于调试。
请勿使用var。使用let或const。
除非没有其他方法，否则请避免使用全局范围变量。

Answer 2

由于ft的范围是在函数内部定义的，因此无法访问。需要将其移至其他方法可以引用它的范围。

var ft;  // define it outside
function reset() {
  // var f = document.getElementById("ff").onclick; <<-- no clue what this is doing
  if (ft) window.clearTimeout(ft); // if it is running, remove it
  ft = setTimeout(dontf, 3000);
  // f = ft; <-- does not make sense
}

function dontf() {
  document.getElementById("r").src="H.jpg";
}

function s() {
  if (document.getElementById("r").src == "file:///C:/Users/S.jpg") {
    if (ft) clearTimeout(ft);
  }
}

如何清除JavaScript中的函数超时？

2 个答案: