<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <title>计时器</title>

  <script>

    var hour,minute,second;//时 分 秒

    hour=minute=second=0;//初始化

    var millisecond=0;//毫秒

    var int;

    function Reset()//重置

    {

      window.clearInterval(int);

      millisecond=hour=minute=second=0;

      document.getElementById('timetext').value='00时00分00秒000毫秒';

    }

    function start()//开始

    {

      int=setInterval(timer,50);

    }

    function timer()//计时

    {

      millisecond=millisecond+50;

      if(millisecond>=1000)

      {

        millisecond=0;

        second=second+1;

      }

      if(second>=60)

      {

        second=0;

        minute=minute+1;

      }

      if(minute>=60)

      {

        minute=0;

        hour=hour+1;

      }

      document.getElementById('timetext').value=hour+'时'+minute+'分'+second+'秒'+millisecond+'毫秒';

    }

    function stop()//暂停

    {

      window.clearInterval(int);

    }

  </script>

</head>

<body>

<div style="text-align: center">

  <input type="text" id="timetext" value="00时00分00秒" readonly><br>

  <button type="button" onclick="start()">开始</button> <button type="button" onclick="stop()">暂停</button> <button type="button" onclick="Reset()">重置</button>

</div>

</body>

</html>

　该计时器可以实现开始，暂停，重置的功能

js实现时分秒毫秒计时器的更多相关文章

  1. SqlSever基础 getdate函数 返回系统当前的年月日，时分秒 毫秒

    镇场诗:---大梦谁觉,水月中建博客.百千磨难,才知世事无常.---今持佛语,技术无量愿学.愿尽所学,铸一良心博客.------------------------------------------ ...

  2. 年月日时分秒毫秒+随机数getSerialNum

    package com.creditharmony.apporveadapter.core.utils; import java.io.ByteArrayInputStream; import jav ...

  3. Asp.net(C#)年月日时分秒毫秒

    年月日时分秒毫秒格式:yyyyMMddHHmmssfff

  4. C语言获取字符年月日时分秒毫秒

    概述 本文演示环境: Windows10 使用C语言获取年月日时分秒毫秒, 代码 #include <iostream> #include <string> #include ...

  5. 时间格式的转化 vue与js 年月日 时分秒

    首先使用原生转化的方法 第一种 //时间转换 dateStr(d, sign) { //如果没有传递符号,给一个默认的符号 if (!sign) { sign = '-' } //获取d里面年月日时分 ...

  6. Android Calendar获取年月日时分秒毫秒

    开始使用new Date()测试,并用通过date.getMonth(),和date.getDay()获取,不过后来发现这两个访求是jdk1.1版本的,现在已经不用了,而且结果也不正确. ; int ...

  7. js简单时分秒倒计时

    效果: javascript: <script type="text/javascript"> function countTime() { //获取当前时间 var ...

  8. Java输出当前的日期（年月日时分秒毫秒）

    package test.remote.tools.combine; import java.text.SimpleDateFormat; import java.util.Calendar; imp ...

  9. java日期格式(年月日时分秒毫秒)

    package test.remote.tools.combine; import java.text.SimpleDateFormat; import java.util.Calendar; imp ...

随机推荐

  1. Pyppeteer

    pyppeteer模块的基本使用 引言 Selenium 在被使用的时候有个麻烦事,就是环境的相关配置,得安装好相关浏览器,比如 Chrome.Firefox 等等,然后还要到官方网站去下载对应的驱动 ...

  2. Web协议详解与抓包实战：HTTP1协议-内容协商是怎样进行的（8）

    一.内容协商的两种方式 每个 URI 指向的资源可以是任何事物,可以有多种不同的表述,例如一份文档可以有不同语言的翻译.不同的媒体格式.可以针对不同的浏览器提供不同的压缩编码等 二.Proactive ...

  3. [LeetCode] 378. Kth Smallest Element in a Sorted Matrix 有序矩阵中第K小的元素

    Given a n x n matrix where each of the rows and columns are sorted in ascending order, find the kth ...

  4. [LeetCode] 215. Kth Largest Element in an Array 数组中第k大的数字

    Find the kth largest element in an unsorted array. Note that it is the kth largest element in the so ...

  5. oracle--DG模式备库归档缺失问题（1）

    01.问题描述 备库的归档日志没有增加,一直等待一个 查询问题: SQL> SELECT * FROM V$ARCHIVE_GAP; THREAD# LOW_SEQUENCE# HIGH_SEQ ...

  6. 初探Java设计模式4：一文带你掌握JDK中的设计模式

    转自https://javadoop.com/post/design-pattern 行为型模式 策略模式 观察者模式 责任链模式 模板方法模式 状态模式 行为型模式总结 本系列文章将整理到我在Git ...

  7. C#用mouse_event模拟鼠标点击的问题

    1.首先添加using System.Runtime.InteropServices; 2.为鼠标添加模拟点击的各种参数 //鼠标事件  因为我用的不多,所以其他参数没有写 1 2 3 4 5 6 7 ...

  8. ORA-12528: TNS:listener: all appropriate instances are blocking new connections

    Oracle问题:ORA-12528: TNS: 监听程序: 所有适用例程都无法建立新连接 问题原始描述: ORA-12528: TNS:listener: all appropriate insta ...

  9. linux下发布项目

    查看端口

  10. Sitecore 十大优秀功能

    为客户的需求创建最佳解决方案是我们的主要目标.良好的设计不仅仅是视觉吸引力,还要确保用户体验简单直观.在设计Sitecore网站时,我们始终牢记这一点  . 以下是一些我最喜欢的功能,可以帮助我们使用 ...