遇到问题" setInterval / clearInterval"在Javascript中

时间:2014-05-26 06:12:51

标签: javascript

所以我有这个按钮:

<input name="start" type="button" value="Go!" onclick="activate()" />

接下来是这个javascript:

var timerID_;
function activate() {
    timerID_ = setInterval(someFunction, 300);
}

所以这个功能正常,直到我试图停止间隔。所以我做了一个停止按钮:

<input name="pause" type="button" value="Stop" onclick="pause()" />

随附javascript(在同一个脚本中):

function pause() {
    clearInterval(timerID_);
}

然而,当我按下按钮时这不起作用这个可行,但是,我只是放置了#34; pause()&#34;进入onclick属性:

<input name="stop" type="button" value="Stop" onclick="clearInterval(timerID_)" />

就像我想要的那样,第二个&#34;停止&#34;按钮暂停间隔。有谁知道这是为什么?

编辑:这是&#34; someFunction&#34; (不确定它是否有帮助)。基本上是什么:http://spreeder.com。我接受用户(文本)输入,并在显示框中逐字显示。

function someFunction() {
    var text = document.getElementById('userInput').value;
    var newText = text.split(" ");
    if (i == newText.length || newText[i] == undefined)
        pause();
    else {
        document.getElementById('display').innerHTML = newText[i];
        i++;
    }
}

另外:我使用pause()时得到的错误; 未捕获的TypeError:对象不是函数

2 个答案:

答案 0 :(得分:2)

这种情况发生的原因是浏览器将使用页面上存在的任何表单控件的名称创建变量。所以如果你有这样一个按钮:

<input name="pause" type="button" value="Stop" onclick="pause()" />

浏览器将创建一个名为pause的变量,您可以使用该变量来访问此input,但它将屏蔽(隐藏)您之前声明的pause()函数。因此,当您的事件处理程序尝试调用pause()时,它将尝试&#34;调用&#34;你的input对象,它根本不是一个函数。

正如您所发现的,一个解决方案是保持函数名称与控件名称不同。更好的解决方案是使用不引人注目的JavaScript。这不会让您无法确保控件名称和功能名称不同,但它应该使您的设计更清晰,并减少此类问题。

答案 1 :(得分:0)

您不能拥有name属性和JavaScript函数的名称相同。我最初做的是:

<input name="pause" type="button" value="Stop" onclick="pause()" />

如果您将name更改为name="stop"之类的其他内容,则不会发生错误。我相信这是因为编译器会将name属性视为一个对象,onclick函数将首先执行该操作。