当前位置: 首页 > news >正文

JavaScript 实现通话计时(时分秒 本示例在uniapp中)

很简单,不做过多解释了,直接上代码

完整代码

<script>data() {return {startTime: 0,intervalId: null,}}methods: {startCall() {this.startTime = Date.now();this.intervalId = setInterval(() => {this.updateDuration();}, 1000);},updateDuration() {let elapsed = Date.now() - this.startTime; // 已经过的毫秒数let hours = Math.floor(elapsed / 3600000);let minutes = Math.floor((elapsed % 3600000) / 60000);let seconds = Math.floor((elapsed % 60000) / 1000);// 补零操作hours = hours < 10 ? '0' + hours : hours;minutes = minutes < 10 ? '0' + minutes : minutes;seconds = seconds < 10 ? '0' + seconds : seconds;this.dialTimeText = hours + ':' + minutes + ':' + seconds;},endCall() {clearInterval(this.intervalId);}}
</script>

相关文章:

  • 北京网站建设多少钱?
  • 辽宁网页制作哪家好_网站建设
  • 高端品牌网站建设_汉中网站制作
  • 2024小卷Spring Boot3.0教程思维导图整理
  • python np.max怎么用
  • 代码随想录算法训练营第41天|LeetCode 121. 买卖股票的最佳时机、122.买卖股票的最佳时机II、123.买卖股票的最佳时机III
  • 多进程编程思维导图
  • 06 定时器和PWM(1)
  • OD C卷 - 最多购买宝石数目
  • DBMS-1.2 关系运算
  • 使用Leaflet GeoMan结合天地图进行自由标绘实战
  • 备忘录模式
  • 使用GenAI做Discord舆情分析对游戏运营的帮助
  • 技术学习笔记 1:C++标准库异常类(c++中怎样用自己错误信息交给try catch捕获)
  • 餐饮连锁加盟的网页UI,如果不大气,谁能相信你的品牌力
  • Package.Json 参数配置理解用途
  • C:关于位操作符:、|、^、~的一些应用
  • 百日筑基第三十七天-阿里开发手册编程规约
  • SegmentFault for Android 3.0 发布
  • Apache的80端口被占用以及访问时报错403
  • Facebook AccountKit 接入的坑点
  • js学习笔记
  • node 版本过低
  • Node项目之评分系统(二)- 数据库设计
  • OSS Web直传 (文件图片)
  • Phpstorm怎样批量删除空行?
  • python docx文档转html页面
  • Python语法速览与机器学习开发环境搭建
  • Spring Cloud Feign的两种使用姿势
  • 创建一个Struts2项目maven 方式
  • 深度解析利用ES6进行Promise封装总结
  • 实战:基于Spring Boot快速开发RESTful风格API接口
  • 微信开放平台全网发布【失败】的几点排查方法
  • 我的面试准备过程--容器(更新中)
  • 学习HTTP相关知识笔记
  • 用jquery写贪吃蛇
  • ​软考-高级-系统架构设计师教程(清华第2版)【第12章 信息系统架构设计理论与实践(P420~465)-思维导图】​
  • #### golang中【堆】的使用及底层 ####
  • #我与虚拟机的故事#连载20:周志明虚拟机第 3 版:到底值不值得买?
  • (02)Cartographer源码无死角解析-(03) 新数据运行与地图保存、加载地图启动仅定位模式
  • (2)MFC+openGL单文档框架glFrame
  • (翻译)terry crowley: 写给程序员
  • (官网安装) 基于CentOS 7安装MangoDB和MangoDB Shell
  • (生成器)yield与(迭代器)generator
  • (一)Docker基本介绍
  • (一)Java算法:二分查找
  • (一)SvelteKit教程:hello world
  • (自用)仿写程序
  • .net core 3.0 linux,.NET Core 3.0 的新增功能
  • .net core 依赖注入的基本用发
  • .net 程序 换成 java,NET程序员如何转行为J2EE之java基础上(9)
  • .NET(C#) Internals: as a developer, .net framework in my eyes
  • .Net6 Api Swagger配置
  • .net6 当连接用户的shell断掉后,dotnet会自动关闭,达不到长期运行的效果。.NET 进程守护
  • .net反编译的九款神器
  • .Net下使用 Geb.Video.FFMPEG 操作视频文件
  • ??eclipse的安装配置问题!??
  • @拔赤:Web前端开发十日谈