首页 > Web开发 > 详细

网页显示当前时间的方法

时间:2019-07-27 22:36:42      阅读:84      评论:0      收藏:0      [点我收藏+]

技术分享图片



<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
    <input type="text" class="b1" >
<input type="button" value="开始" class="b2">
<input type="button" value="stop" class="b3">
</body>
<script>
// 获取到输入框
var b2Ele = document.getElementsByClassName("b2")[0];
var b1Ele=document.getElementsByClassName("b1")[0];
var b3Ele=document.getElementsByClassName("b3")[0];
var res = ‘‘; //判断我们的计时器是否已经存在,未关闭
// 定时执行函数
var show_time = function(){
var cTime=new Date(); //创建一个时间对象,来产生一个当前的时间
b1Ele.value = cTime.toLocaleString();
};
//点击事件,触发开始计时
b2Ele.onclick = function(){
if (!res){
res = setInterval(show_time,1000); //setInterval设置一个以1000毫秒,来执行一次展示时间的函数
         console.log(res)}else {
console.log("已清空");
}
};

//点击开始停止时间
b3Ele.onclick=function(){
clearInterval(res); //清空我们的计时器
res = false;
}
</script>
</html>

网页显示当前时间的方法

原文:https://www.cnblogs.com/zhangte03/p/11256757.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!