900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > js实现在页面实时显示时间 一个按钮控制时间暂停和开始

js实现在页面实时显示时间 一个按钮控制时间暂停和开始

时间:2019-12-30 02:20:54

相关推荐

js实现在页面实时显示时间 一个按钮控制时间暂停和开始

js实现在html实时显示时间,一个按钮控制时间暂停和开始.代码如下:

<head><meta charset="UTF-8"><title></title></head><style>#main {width: 500px;height: 250px;margin: 20px auto;border: 1px solid #000000;}#the_button {width: 200px;margin: 10px auto;}label {display: inline-block;float: left;margin-right: 10px;width: 150px;text-align: right;}</style><body><div id="main"><label>当前的时间是:</label><input type="text" id="text_1" readonly/><br /><div id="the_button"><input type="button" id="time_button" value="暂停" onclick="controlTime()" /></div></div></body><script>/** 获取时间*/var myClock = setInterval("nowTime()",1000);function nowTime(){var date = new Date();var year = date.getFullYear();var month = date.getMonth() + 1;var day = date.getDate();var hour = date.getHours();var min = date.getMinutes();var s = date.getSeconds();month = check(month);day = check(day);hour = check(hour);min = check(min);s = check(s);var timeStr = year + "-" + month + "-" + day + " " + hour + ":" + min + ":" + s; document.getElementById("text_1").value = timeStr;}/**添加0*/function check(i){if( i < 10){i = "0" + i;}return i;}/**一个按钮实现开始和暂停功能*/function controlTime(){var btnValue = document.getElementById("time_button").value;if(btnValue == "暂停"){window.clearInterval(myClock);document.getElementById("time_button").value = "开始";}if(btnValue == "开始"){window.setInterval("nowTime()",1000);document.getElementById("time_button").value = "暂停";}}</script>

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。