js实现从0开始计时及显示当前时间

2024-06-22 20:32

本文主要是介绍js实现从0开始计时及显示当前时间,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

需求:

页面点击进来,就从0开始计时,动态显示用户停留在该页面的时间。

思路:

记录用户进入该页面的时间(初始时间);

不断用当前时间-初始时间=在该页面的停留时间;

需要注意的是,应该将js函数Time()放到<body>的onload中,即页面一加载就执行

js函数应该放在<head>标签中

js:

<script type="text/javascript">/** 显示当前时间函数* YQ*/function Time(){var today=new Date(); var h=today.getHours();var m=today.getMinutes();var s=today.getSeconds();duration(h,m,s);// add a zero in front of numbers<10m=checkTime(m);s=checkTime(s);document.getElementById('timeshow').value=h+":"+m+":"+s;t=setTimeout('Time()',500); //暂停0.5后执行Time()函数}/** 个位数时补0*/function checkTime(i) {if (i<10) {i="0" + i}return i}/** 历时:当前时间-开始时间* @author YQ*/function duration(nh,nm,ns){var beginTime = document.getElementById('beginTime').value; //获取计时初始值var beginT = new Array();beginT = beginTime.split(" ");beginT = beginT[1].split(":");var sh = Number(beginT[0]);var sm = Number(beginT[1]);var ss = Number(beginT[2]);//换算历时 h:m:svar allS = (nh*3600+nm*60+ns)-(sh*3600+ sm*60 +ss);var dh = parseInt(allS/3600);var dm = parseInt((allS-dh*3600)/60);var ds = allS - dh*3600 - dm*60;document.getElementById('duration').value = dh+':'+dm+':'+ds;}</script>

html:

<body οnlοad="Time()"> 

<b>历时:</b><input type="text" id="duration" style="border:0px;background-color:transparent;width:80px;" />
<b>当前时间:</b><input type="text" id="timeshow" style="border:0px;background-color:transparent;width:80px;" />
</body>


这篇关于js实现从0开始计时及显示当前时间的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1085335

相关文章

使用Java实现通用树形结构构建工具类

《使用Java实现通用树形结构构建工具类》这篇文章主要为大家详细介绍了如何使用Java实现通用树形结构构建工具类,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录完整代码一、设计思想与核心功能二、核心实现原理1. 数据结构准备阶段2. 循环依赖检测算法3. 树形结构构建4. 搜索子

MySQL多列IN查询的实现

《MySQL多列IN查询的实现》多列IN查询是一种强大的筛选工具,它允许通过多字段组合快速过滤数据,本文主要介绍了MySQL多列IN查询的实现,具有一定的参考价值,感兴趣的可以了解一下... 目录一、基础语法:多列 IN 的两种写法1. 直接值列表2. 子查询二、对比传统 OR 的写法三、性能分析与优化1.

在C#中调用Python代码的两种实现方式

《在C#中调用Python代码的两种实现方式》:本文主要介绍在C#中调用Python代码的两种实现方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录C#调用python代码的方式1. 使用 Python.NET2. 使用外部进程调用 Python 脚本总结C#调

Python实现自动化接收与处理手机验证码

《Python实现自动化接收与处理手机验证码》在移动互联网时代,短信验证码已成为身份验证、账号注册等环节的重要安全手段,本文将介绍如何利用Python实现验证码的自动接收,识别与转发,需要的可以参考下... 目录引言一、准备工作1.1 硬件与软件需求1.2 环境配置二、核心功能实现2.1 短信监听与获取2.

使用Python实现获取网页指定内容

《使用Python实现获取网页指定内容》在当今互联网时代,网页数据抓取是一项非常重要的技能,本文将带你从零开始学习如何使用Python获取网页中的指定内容,希望对大家有所帮助... 目录引言1. 网页抓取的基本概念2. python中的网页抓取库3. 安装必要的库4. 发送HTTP请求并获取网页内容5. 解

mysql如何查看当前连接数

《mysql如何查看当前连接数》:本文主要介绍mysql如何查看当前连接数问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录mysql查看当前连接数查看mysql数据库允许最大连接数总结mysql查看当前连接数查看当前连接数SHOW STATUS LIKE

SpringBoot如何通过Map实现策略模式

《SpringBoot如何通过Map实现策略模式》策略模式是一种行为设计模式,它允许在运行时选择算法的行为,在Spring框架中,我们可以利用@Resource注解和Map集合来优雅地实现策略模式,这... 目录前言底层机制解析Spring的集合类型自动装配@Resource注解的行为实现原理使用直接使用M

Python实现Microsoft Office自动化的几种方式及对比详解

《Python实现MicrosoftOffice自动化的几种方式及对比详解》办公自动化是指利用现代化设备和技术,代替办公人员的部分手动或重复性业务活动,优质而高效地处理办公事务,实现对信息的高效利用... 目录一、基于COM接口的自动化(pywin32)二、独立文件操作库1. Word处理(python-d

Java时间轮调度算法的代码实现

《Java时间轮调度算法的代码实现》时间轮是一种高效的定时调度算法,主要用于管理延时任务或周期性任务,它通过一个环形数组(时间轮)和指针来实现,将大量定时任务分摊到固定的时间槽中,极大地降低了时间复杂... 目录1、简述2、时间轮的原理3. 时间轮的实现步骤3.1 定义时间槽3.2 定义时间轮3.3 使用时

使用Python实现网络设备配置备份与恢复

《使用Python实现网络设备配置备份与恢复》网络设备配置备份与恢复在网络安全管理中起着至关重要的作用,本文为大家介绍了如何通过Python实现网络设备配置备份与恢复,需要的可以参考下... 目录一、网络设备配置备份与恢复的概念与重要性二、网络设备配置备份与恢复的分类三、python网络设备配置备份与恢复实