Javascript代码未在onload函数中运行

我想知道为什么这个代码不起作用。当我把它放在onload函数中时，它不起作用，我不知道为什么。我在onload函数中还有很多其他代码，但在本例中我删除了它。无论如何，其他代码可以正常工作，只有这部分不行

window.onload=function（）{
变量i，定时器，除法；
i=0；
除以=100；
函数start（）{
定时器=self.setInterval（“增量（）”，（1000/除））；
}
函数增量（）{
i++；
document.getElementById（“timer_out”）.innerHTML=（i/divide）；
}
函数停止（）{
清除间隔（计时器）；
定时器=空；
}
函数重置（）{
停止（）；
i=0；
document.getElementById（“timer_out”）.innerHTML=（i/divide）；
}
}

0

您需要在onload范围之外定义函数和变量，否则无法访问它们

var i, timer, divide;
function start() {
    if(!timer) {
        timer = setInterval("increment()", (1000 / divide)); 
    }
}

function increment() {
    i++;
    document.getElementById("timer_out").innerHTML = (i / divide);
}

function stop() {
    clearInterval(timer);
    timer = null;
}

function reset() {
    stop();
    i = 0;
    document.getElementById("timer_out").innerHTML = (i / divide);
}
window.onload = function() {
    i = 0;
    divide = 100;
}

正如在评论中提到的，您还有一个bug，如果您多次单击start，则无法停止计时器。这是因为您正在创建两个（或更多）计时器，但只引用了最后一个计时器。要解决这个问题，一个简单的

if

语句检查计时器是否存在就足够了。上面的代码已经更新以显示这一点，下面是它运行的示例：

问题：

从

onxyz

属性引用的函数必须是全局函数。您的函数不是全局函数，因为它们是在

onload

处理程序中声明的。有些人会告诉你让他们成为全球性的，但有一个更好的答案

onload

几乎可以肯定要比您希望运行的代码晚很多。例如，它会等到所有图像都完全下载完毕

使用带有

setTimeout

/

setInterval

的字符串通常不是一个好主意

是无效的HTML。在HTML中，一个

br

元素被写入

。如果愿意，也可以编写

或

，但是

/

在HTML中没有意义。（它在XHTML中具有含义。）

无需在

setTiemout

/

setInterval

前面加上

self.

。它可以工作，因为有一个默认的

self

global，但它是不必要的

如果单击两次

start

，您将覆盖上一个计时器的句柄，并且无法停止它。在开始之前，我们需要调用

停止

请参阅下面的评论，了解我是如何解决这些问题的

没有jQuery（因为您标记了它，但似乎没有使用它）

//此脚本位于HTML的末尾，在结束之前
//标记，以及上面的HTML定义的所有元素
//将在那里，并准备好让我们处理。不需要“onload”。
//但我们将使用作用域函数来避免创建全局变量。
（功能（）{
变量i，定时器，除法；
//扣上我们的扣子。
//对于这样一个非常简单的事情，我们可以指定
//它们的onclick属性，但对于任何更复杂的
//我会使用addEventListener（如果
//浏览器没有addEventListener来支持过时的
//IE类似于IE8），但对于这个小例子来说，这太过分了。
document.querySelector（“输入[value=Start]”）。onclick=Start；
document.querySelector（“输入[value=Stop]”。onclick=Stop；
document.querySelector（“输入[value=Reset]”）。onclick=Reset；
i=0；
除以=100；
timer=0；//我们可以安全地传递给clearInterval的值
//如果我们再也不做别的事
函数start（）{
//确保停止任何以前的计时器
停止（）；
//注意：没有引号或（），我们正在传递对
//将函数递增为“setInterval”。
//也不需要“自我”`
定时器=设置间隔（增量，（1000/除以））；
}
函数增量（）{
i++；
document.getElementById（“timer_out”）.innerHTML=（i/divide）；
}
函数停止（）{
清除间隔（计时器）；
定时器=空；
}
函数重置（）{
停止（）；
i=0；
document.getElementById（“timer_out”）.innerHTML=（i/divide）；
}
})();

0


而不是在window.onload.中编写函数。。把它们写在外面就行了。。。当您在window.onload函数中写入它们时，它们是不可访问的…只需在外部写入它们，您的代码就会正常运行
您是否检查了控制台？（点击F12将其打开）。你的答案就在那里。基本上，您的函数需要是全局函数才能在
onclick
处理程序中访问它们。更好的方法是使用
.addEventListener
@MikeC我对此感到困惑，你的意思是什么？基本上@MikeC想说的是，你的每个按钮的
onclick
事件都无法调用它的函数，因为你把它们的函数包装在
onload
事件中。问题是，您的按钮在其功能声明之前加载。@Blindeagle:您的
onload
中仍然有它们。（提示：一致的缩进可以更容易地看到类似的内容。）@Blindeagle您链接到的代码不包含修复程序。此外，您还需要删除
self.
，因为您没有声明
self
。最后，避免使用带有
setInterval
的字符串。相反，只需编写
setInterval（增量，1000/除法）
对
self
catch的良好观察，将其从我的answer@MikeC你是一个美丽的男人！非常感谢@choz提到的所有帮助，真的很高兴xAs。关于多次按下“开始”按钮，您有一个bug。我已经更新了我的答案，并对此进行了修复。与miller的答案相同，单击两次“开始”

，将无法停止。@choz:谢谢！修复。啊，没有看到这个问题，如果你知道任何方法来修复它，请让我know@Blindeagle：答案中已修复（点击