Javascript 时钟总是在显示_Javascript_Onclicklistener

Javascript 时钟总是在显示

javascript

Javascript 时钟总是在显示,javascript,onclicklistener,Javascript,Onclicklistener,大家好，我正在尝试创建一个时钟，只有当某个div被点击时才会显示。但似乎正在发生的是，时钟总是在显示，我不知道为什么会发生这种情况。下面是我迄今为止尝试过的代码 <!DOCTYPE html> <html> <head> <title>JS Clock tuts</title> </head> <body> <div id="stop">CLICK HERE</div>

大家好，我正在尝试创建一个时钟，只有当某个div被点击时才会显示。但似乎正在发生的是，时钟总是在显示，我不知道为什么会发生这种情况。下面是我迄今为止尝试过的代码

<!DOCTYPE html>
<html>
<head>
    <title>JS Clock tuts</title>
</head>
<body>
    <div id="stop">CLICK HERE</div>
    <script>

    var get = document.getElementById("stop");
    get.addEventListener("click", showTime())

        function showTime() {
            var now = new Date();
            var h = now.getHours();
            var m = now.getMinutes();
            var s = now.getSeconds();
            var state = "AM";

            s = (s < 10) ? "0" + s : s;
            m = (m < 10) ? "0" + m : m;

            if (h > 12) 
            {
                h = h - 12;
                state = "PM";
            }

            if (h == 0) 
            {
            h = 12;
            }
            var time = h + ":" + m +":" + s + " " + state;
            document.getElementById("stop").innerHTML = time;
            setTimeout(showTime, 0);
        }

    </script>
</body>
</html>


JS时钟图茨
点击这里
var get=document.getElementById（“停止”）；
get.addEventListener（“单击”，showTime（））
函数showTime（）{
var now=新日期（）；
var h=now.getHours（）；
var m=now.getMinutes（）；
var s=now.getSeconds（）；
var state=“AM”；
s=（s<10）？“0”+s:s；
m=（m<10）-“0”+m:m；
如果（h>12）
{
h=h-12；
state=“PM”；
}
如果（h==0）
{
h=12；
}
变量时间=h+“：“+m+”：“+s+”+状态；
document.getElementById（“stop”）.innerHTML=时间；
设置超时（显示时间，0）；
}

您需要捕获鼠标向下移动并添加一个类似于您现在拥有的侦听器。此外，您需要将setTimeout分配给一个变量，以便在mouseup上取消它。然后向mouseup添加一个侦听器，该侦听器将取消mousedown中设置的超时并重置div文本

var get=document.getElementById（“停止”）；
var显示时钟；
get.addEventListener（“mousedown”，showTime）；
get.addEventListener（“mouseup”，function（））
{
如果（显示时钟）{
clearTimeout（显示时钟）；
}
document.getElementById（“停止”）.innerHTML=“单击此处”；
});
函数showTime（）{
var now=新日期（）；
var h=now.getHours（）；
var m=now.getMinutes（）；
var s=now.getSeconds（）；
var state=“AM”；
s=（s<10）？“0”+s:s；
m=（m<10）-“0”+m:m；
如果（h>12）
{
h=h-12；
state=“PM”；
}
如果（h==0）
{
h=12；
}
变量时间=h+“：“+m+”：“+s+”+状态；
document.getElementById（“stop”）.innerHTML=时间；
showClock=setTimeout（showTime，0）；
}


JS时钟图茨
点击这里

只需从showTime（）中删除（）

请尝试以下代码

var get=document.getElementById（“停止”）；
get.addEventListener（“单击”，showTime）
函数showTime（）{
var now=新日期（）；
var h=now.getHours（）；
var m=now.getMinutes（）；
var s=now.getSeconds（）；
var state=“AM”；
s=（s<10）？“0”+s:s；
m=（m<10）-“0”+m:m；
如果（h>12）
{
h=h-12；
state=“PM”；
}
如果（h==0）
{
h=12；
}
变量时间=h+“：“+m+”：“+s+”+状态；
document.getElementById（“stop”）.innerHTML=时间；
设置超时（显示时间，0）；
}


单击此处

要这样显示或隐藏吗

document.getElementById（“显示”）.addEventListener（'click'，function（）{
document.getElementById（“时钟”）.style.visibility=“可见”；
showTime（）；
});
document.getElementById（“隐藏”）.addEventListener（'click'，function（）{
document.getElementById（“时钟”）.style.visibility=“隐藏”；
});
函数showTime（）{
var now=新日期（）；
var h=now.getHours（）；
var m=now.getMinutes（）；
var s=now.getSeconds（）；
var state=“AM”；
s=（s<10）？“0”+s:s；
m=（m<10）-“0”+m:m；
如果（h>12）{
h=h-12；
state=“PM”；
}
如果（h==0）{
h=12；
}
变量时间=h+“：“+m+”：“+s+”+状态；
document.getElementById（“时钟”）.innerHTML=时间；
设置超时（显示时间，0）；
}

#时钟{可见性：隐藏}
#显示、隐藏{光标：指针}

show
隐藏

showTime（））

get.addEventListener("click", showTime())
↓
get.addEventListener("click", showTime)