Javascript addEventListener单击“不工作”_Javascript_Addeventlistener

Javascript addEventListener单击“不工作”

javascript

Javascript addEventListener单击“不工作”,javascript,addeventlistener,Javascript,Addeventlistener,我正在创建一个秒表，如下所示： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Stopwatch</title> <link href="https://fonts.googleapis.com/css?family=Saira" rel="stylesheet"> &

我正在创建一个秒表，如下所示：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Stopwatch</title>
        <link href="https://fonts.googleapis.com/css?family=Saira" rel="stylesheet">
        <link href="stopwatch.css" rel="stylesheet">
        <link href="https://fonts.googleapis.com/css?family=Droid+Sans" rel="stylesheet">
    </head>
    <body>
        <div class="but">
        <h1>Stopwatch</h1>
            <p id="timer">0</p>
            <button id="start">Start/Stop</button>
            <button id="reset">Reset</button>
            <button id="record">Record Time</button>
        </div>
    </body>
</html>

但是，当我单击“开始”按钮时，它不起作用。有人能解释一下原因吗？

您必须传递函数，而不是立即调用它们：

更改

document.getElementById（“开始”）.addEventListener（“单击”，计数器（））到文档.getElementById（“开始”）.addEventListener（“单击”，计数器）


更改setInterval（time（），10）至设置间隔（时间，10）

请参见下面的演示：

var timer=document.getElementById（“timer”）；
var-sec=0；
document.getElementById（“开始”）.addEventListener（“单击”，计数器）；
函数计数器（）{
设置间隔（时间，10）；
}
功能时间（）{
sec++；
timer.innerHTML=sec；
}

秒表
秒表
0
启动/停止
重置
记录时间
您必须通过该函数，而不是立即调用它们：
更改document.getElementById（“开始”）.addEventListener（“单击”，计数器（））到文档.getElementById（“开始”）.addEventListener（“单击”，计数器）

更改setInterval（time（），10）至设置间隔（时间，10）

请参见下面的演示：

var timer=document.getElementById（“timer”）；
var-sec=0；
document.getElementById（“开始”）.addEventListener（“单击”，计数器）；
函数计数器（）{
设置间隔（时间，10）；
}
功能时间（）{
sec++；
timer.innerHTML=sec；
}

秒表
秒表
0
启动/停止
重置
记录时间
在线：
document.getElementById("start").addEventListener("click", counter());

setInterval(time(), 10);

这是错误的，应该是：
document.getElementById("start").addEventListener("click", counter);

setInterval(time, 10);

当您使用（）
时，它正在调用函数。这里，您将函数传递给addEventListener
，而不是调用它
与该行相同：
document.getElementById("start").addEventListener("click", counter());

setInterval(time(), 10);

应该是：
document.getElementById("start").addEventListener("click", counter);

setInterval(time, 10);


因此，您的代码应该是：
document.getElementById("start").addEventListener("click", counter);

setInterval(time, 10);


var timer=document.getElementById（“timer”）；
var-sec=0；
document.getElementById（“开始”）.addEventListener（“单击”，计数器）；
函数计数器（）{
设置间隔（时间，10）；
}
功能时间（）{
sec++；
timer.innerHTML=sec；
}

秒表
秒表
0
启动/停止
重置
记录时间
在线：
document.getElementById("start").addEventListener("click", counter());

setInterval(time(), 10);

这是错误的，应该是：
document.getElementById("start").addEventListener("click", counter);

setInterval(time, 10);

当您使用（）
时，它正在调用函数。这里，您将函数传递给addEventListener
，而不是调用它
与该行相同：
document.getElementById("start").addEventListener("click", counter());

setInterval(time(), 10);

应该是：
document.getElementById("start").addEventListener("click", counter);

setInterval(time, 10);


因此，您的代码应该是：
document.getElementById("start").addEventListener("click", counter);

setInterval(time, 10);


var timer=document.getElementById（“timer”）；
var-sec=0；
document.getElementById（“开始”）.addEventListener（“单击”，计数器）；
函数计数器（）{
设置间隔（时间，10）；
}
功能时间（）{
sec++；
timer.innerHTML=sec；
}

秒表
秒表
0
启动/停止
重置
记录时间