使用局部变量从另一个函数停止 setTime

Question

感谢您的帮助！这样做的主要目标是停止计时器。但它不起作用。我知道这不起作用，因为我正在从另一个函数调用局部变量，但如果我将变量声明为全局变量，setTime 会自动启动，这不是我想要的。如何解决它或其他选择？谢谢！！这是我的代码：

var interval2;

function startTimef(){

    var startTime = Date.now();
    interval2 = setInterval(function() {
    var elapsedTime = Date.now() - startTime - 5000;
    document.getElementById("timer").innerHTML = (elapsedTime / 1000).toFixed(3);
    
}, 75);

}

function myStopFunction(interval2) {
    
    clearInterval(interval2); // does not work because interval2 is a local variable in StartTime.
    
 var result = document.getElementById("result");
    var score = document.getElementById("timer").textContent;

  if (score < -0.200) { result.innerHTML = score+" Almost there ";}
    if (score < -500 && score < -0.200) { result.innerHTML = "Almost there";}
    if (score > -0.200 && score < 0 ) { result.innerHTML = "No too bad mate";}
    if (score > -0.100 && score < 0.200 ) { result.innerHTML = "Perfect !!!";}
    if (score > 0.200 ) { result.innerHTML = "You need some work!";}
   
};

// Press Enter Keyboard

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>TimeOver</title>
</head>
<body>
<div class="main-box">
    <h2>Try to Stop the timer as close as possible to cero</h2>
    <p id="timer">0000</p>
    <button id="stop" onclick="myStopFunction()" >Stop time</button>
    <span id="result"></span>
    <button id="" onclick="startTimef()" >start</button>  
</div>
    <script src="main.js"></script>
</body>
</html>

Answer 1

试试这个。从 myStopFunction(interval2) 中删除 interval2 即可。您的第一种方法不会，因为您有 2 个 interval2 变量，并且 JS 将使用本地声明的 interval2 而不是外部 interval2.

var interval2;

function startTimef(){

    var startTime = Date.now();
    interval2 = setInterval(function() {
        var elapsedTime = Date.now() - startTime - 5000;
        document.getElementById("timer").innerHTML = (elapsedTime / 1000).toFixed(3);

    }, 75);
}

function myStopFunction() {
  clearInterval(interval2);
  var result = document.getElementById("result");
  var score = document.getElementById("timer").textContent;

  if (score < -0.200) { result.innerHTML = score+" Almost there ";}
    if (score < -500 && score < -0.200) { result.innerHTML = "Almost there";}
    if (score > -0.200 && score < 0 ) { result.innerHTML = "No too bad mate";}
    if (score > -0.100 && score < 0.200 ) { result.innerHTML = "Perfect !!!";}
    if (score > 0.200 ) { result.innerHTML = "You need some work!";}
   
};

// Press Enter Keyboard

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>TimeOver</title>
</head>
<body>
<div class="main-box">
    <h2>Try to Stop the timer as close as possible to cero</h2>
    <p id="timer">0000</p>
    <button id="stop" onclick="myStopFunction()" >Stop time</button>
    <span id="result"></span>
    <button id="" onclick="startTimef()" >start</button>  
</div>
    <script src="main.js"></script>
</body>
</html>

使用局部变量从另一个函数停止 setTime

stop setTime from another function with local variable

javascript

timer

local-variables

settimeout

clearinterval