javascript 秒表计时器实现代码

2024-12-18 08:26:13

javascript 秒表计时器

实例代码：

<html lang="en">
<head>
<meta charset="UTF-8">
<title>js计时器</title>
</head>
<body>
<input type="text" value="00:00">
<input type="button" value="开始">
<input type="button" value="结束">
<input type="button" value="重置">
<script>

  var oTxt=document.getElementsByTagName("input")[0];
  var oStart=document.getElementsByTagName("input")[1];
  var oStop=document.getElementsByTagName("input")[2];
  var oReset=document.getElementsByTagName("input")[3];
  var n= 0, timer=null;
  //开始计时
  oStart.onclick= function () {
    clearInterval(timer);
    timer=setInterval(function () {
      n++;
      var m=parseInt(n/60);
      var s=parseInt(n%60);
      oTxt.value=toDub(m)+":"+toDub(s);
    },1000/60);
  };
  //暂停并且清空计时器
  oStop.onclick= function () {
    clearInterval(timer);
  }
  //重置
  oReset.onclick= function () {
    oTxt.value="00:00";
    n=0;
  }
  //补零
  function toDub(n){
    return n<10?"0"+n:""+n;
  }
</script>
</body>
</html>

在计时器设置运行间隔那里，一开始设置了100，其实是不对的，因为 1秒=1000毫秒；我们要分成60个数字来显示，所以还是要除以60才对。

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！

javascript设计简单的秒表计时器

本文实例讲述了javascript设计简单的秒表计时器的实现代码.分享给大家供大家参考.具体如下: 运行效果截图如下: 具体代码如下: <html> <head> <title> New Document </title> </head> <body> <form action="somepage.asp"> <input type="text" value="0&q
原生js实现秒表计时器功能

本文实例为大家分享了带有开始.暂停.清除功能的js计时器,供大家参考,具体内容如下效果图: 下面贴代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>计时器</title> <script> var hour,minute,second;//时分秒 hour=minute=secon
javascript实现秒表计时器的制作方法

本文实例为大家分享了js秒表计时器的制作代码,供大家参考,具体内容如下具体代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="gb2312"> <title>Document</title> <style> div{margin-top:40px;margin-left:25px;margin-bottom:10px
javascript 秒表计时器实现代码

javascript 秒表计时器实例代码: <html lang="en"> <head> <meta charset="UTF-8"> <title>js计时器</title> </head> <body> <input type="text" value="00:00"> <input type="button
浅谈JavaScript的计时器对象

1.JavaScript计时器,我们可以在设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行. 计时器类型: 1)一次性计时器:仅在指定的延迟时间之后触发一次. 2)间隔性触发计时器:每隔一定的时间间隔就触发一次. 计时器方法: 1)setInterval() :在执行时,从载入页面后每隔指定的时间执行代码. //语法 setInterval(代码,交互时间); //参数说明:1. 代码:要调用的函数或要执行的代码串.2. 交互时间:周期性执行或调用表达式之间的时间间隔,以毫秒计(1s=
秒表计时器以及STOPWATCH(实例讲解)

Stopwatch:秒表计时器,用来记录程序的运行时间,通常用来测试代码在时间上的执行效率.(需要引用:System.Diagnostics.) Stopwatch sw=new Stopwatch();//实例化一个对象. sw.Start():开启计时器. sw.Stop():关闭计时器. sw.Elapsed:[属性]获取计时器开始到结束之间的时长. 下面的代码就可以测出某段执行代码的运行时间: using UnityEngine; using System.Diagnostics; pu
Java调用JavaScript实现字符串计算器代码示例

如果表达式是字符串的形式,那么一般我们求值都会遇到很大的问题. 这里有一种直接调用JavaScript的方法来返回数值,无疑神器. 代码如下: package scc; import javax.script.ScriptEngine; import javax.script.ScriptEngineManager; import javax.script.ScriptException; public class Counter { public static void main(String
js实现秒表计时器

本文实例为大家分享了js实现秒表计时器的具体代码,供大家参考,具体内容如下秒表计时器的实现: 效果图如下: 附代码,已调试运行 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=
JS实现一个秒表计时器

本文实例为大家分享了JS实现秒表计时器的具体代码,供大家参考,具体内容如下秒表计时器的实现: 效果图如下: 附代码,已调试运行 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=
JavaScript用20行代码实现虎年春节倒计时

春节将至,小梦相信大家跟小朦梦一样很激动呀.为了迎接虎年春节到来,小梦撸了一个虎年春节倒计时,仅20行代码用js就实现啦,是不是很简单呢?我们用这20行代码不仅能做个虎年春节倒计时,还能从中学到JS相关知识,一举两得!话不多说,接下来小伙伴们跟着小梦一起也动手试试吧! 虎年春节倒计时局部效果图虎年春节倒计时全局效果图,灰常可爱的小老虎呀~ JS关键代码实现 window.onload=function starttime(){ // 2022年春节时间 time(h1,'2022/2/1');
JavaScript编写棋盘覆盖代码详解

一.前言之前做了一个算法作业,叫做棋盘覆盖,本来需要用c语言来编写的,但是因为我的c语言是半桶水(哈哈),所以索性就把网上的c语言写法改成JavaScript写法,并且把它的覆盖效果显示出来二.关键代码 <!DOCTYPE html> <html> <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <titl

javascript 秒表计时器实现代码

相关推荐

随机推荐