Question

我不确定我的代码中缺少的是什么。我无法让我的clearTimeout工作......我一直收到错误，说myStopFunction（）没有定义。有任何想法吗？我已经尝试重命名并检查以确保一切都匹配，我只是不确定为什么我一直得到这个dang错误！

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>ASCII Animations</title>
<h1> ASCII Animation Editor/Viewer </h1>
<br><h3> Jordan Keith: Linn-Benton Community College</h3>
<body>
<p> Enter the frams below, separated by "=====" 
<input onclick = "playAnimation();" type="button" id= "Play" value = "PLAY" />
<input onclick = "myStopFunction();" type="button" id= "Stop" value = "STOP" /></p>
<textarea id = "frameArea" cols="50" rows="30"></textarea>

<textarea id = "displayArea" cols="50" rows="30"></textarea>

<script src="ASCII.js"></script><br>

</form>
</div> 
</body>
</html>

的JavaScript

function playAnimation()
{
frameStr = document.getElementById("frameArea").value;

if(frameStr.indexOf("\r\n") !=-1)
{
    frameSeq = frameStr.split("=====\r\n");
}
else
{
    frameSeq = frameStr.split("=====\n");
}

currentFrame = 0;
showNextFrame();
}
var t;
function showNextFrame() 
{
document.getElementById("displayArea").value = frameSeq[currentFrame]

currentFrame = (currentFrame+1)% frameSeq.length;

t = setTimeout("showNextFrame();" , 250);
}

function myStopFuntion() 
{
clearTimeout(t);
}

Answer 1

您对myStopFunction的调用缺少C函数。

clearInterval(t);

用于清除Javascript的计时器

Answer 2

由于函数名称中的拼写错误，

myStopFunction未被调用。

将function myStopFuntion()替换为function myStopFunction()。

以下是正在运行的代码：

<head>
<script>
function playAnimation() 
{
    frameStr = document.getElementById("frameArea").value;

    if (frameStr.indexOf("\r\n") != -1) {
        frameSeq = frameStr.split("=====\r\n");
    } else {
        frameSeq = frameStr.split("=====\n");
    }

    currentFrame = 0;
    showNextFrame();
}
var t;

function showNextFrame() 
{
    document.getElementById("displayArea").value = frameSeq[currentFrame];

    currentFrame = (currentFrame + 1) % frameSeq.length;

    t = setTimeout(showNextFrame, 250);

}

function myStopFunction() 
{
    alert("Stopping Now");
    clearTimeout(t);
}
</script>
</head>
<body>
<form>
    <input onclick="playAnimation();" type="button" id="Play" value="PLAY" />
    <input onclick="myStopFunction();" type="button" id="Stop" value="STOP" />
    <textarea id="frameArea" cols="50" rows="30"></textarea>
    <textarea id="displayArea" cols="50" rows="30"></textarea>
</form>
</body>

JSFIDDLE LINK：http://jsfiddle.net/52Nvj/4/

ASCII动画

2 个答案: