Javascript 实现计算器时间功能详解及实例(二)


Posted in Javascript onJanuary 08, 2017

Javascript 计算器:

系列文章:

JS 实现计算器详解及实例代码(一)

Javascript计算器 -> 添加时间在屏显区左上角添加时间显示

效果图如下:

Javascript 实现计算器时间功能详解及实例(二)

代码

初始化

// 计算器初始化
Calculator.prototype.init = function () {
 this.addTdClick();

 // 时间显示
 this.showDate();
};

时间显示

// 在屏显区左上角显示时间日期
Calculator.prototype.showDate = function () {
 $("result-date").innerText = new Date().format("hh:mm:ss EEE yyyy-MM-dd");

 var that = this;
 if (this.timer) clearTimeout(this.timer);
 this.timer = setTimeout(function(){
  that.showDate();
 }, 1000); 
};

时间格式化

Date.prototype.format = function (dateStr){}

通过定时器每隔一秒获取时间去显示

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

Javascript 相关文章推荐
javascript的事件描述
Sep 08 Javascript
jQuery实现切换页面布局使用介绍
Oct 09 Javascript
使用jQuery validate 验证注册表单实例演示
Mar 25 Javascript
探讨JQUERY JSON的反序列化类 using问题的解决方法
Dec 19 Javascript
jQuery实现长按按钮触发事件的方法
Feb 02 Javascript
通过隐藏iframe实现无刷新上传文件操作
Mar 16 Javascript
jquery实现页面加载效果
Feb 21 Javascript
js按条件生成随机json:randomjson实现方法
Apr 07 Javascript
jQuery选择器之子元素选择器详解
Sep 18 jQuery
基于Angularjs-router动态改变Title值的问题
Aug 30 Javascript
解决vue打包css文件中背景图片的路径问题
Sep 03 Javascript
30分钟用Node.js构建一个API服务器的步骤详解
May 24 Javascript
JS 实现计算器详解及实例代码(一)
Jan 08 #Javascript
详解百度百科目录导航树小插件
Jan 08 #Javascript
Three.js基础部分学习
Jan 08 #Javascript
Javascript 高性能之递归,迭代,查表法详解及实例
Jan 08 #Javascript
jQuery实现页面滚动时智能浮动定位
Jan 08 #Javascript
jQuery实现滚动条滚动到子元素位置(方便定位)
Jan 08 #Javascript
jquery实现文字单行横移或翻转(上下、左右跳转)
Jan 08 #Javascript
You might like
星际争霸 Starcraft 发展史
2020/03/14 星际争霸
PHP网页游戏学习之Xnova(ogame)源码解读(二)
2014/06/23 PHP
一个简洁实用的PHP缓存类完整实例
2014/07/26 PHP
php中加密解密DES类的简单使用方法示例
2020/03/26 PHP
jQuery 1.0.2
2006/10/11 Javascript
[原创]js获取数组任意个不重复的随机数组元素
2010/03/15 Javascript
jquery实现ajax提交form表单的方法总结
2014/03/03 Javascript
javascript实现textarea中tab键的缩排处理方法
2015/06/26 Javascript
一个用jquery写的判断div滚动条到底部的方法【推荐】
2016/04/29 Javascript
浅谈jquery高级方法描述与应用
2016/10/04 Javascript
js学习总结之DOM2兼容处理顺序问题的解决方法
2017/07/27 Javascript
详解webpack4升级指南以及从webpack3.x迁移
2018/06/12 Javascript
Vue iview-admin框架二级菜单改为三级菜单的方法
2018/07/03 Javascript
Koa 使用小技巧(小结)
2018/10/22 Javascript
bootstrap table实现合并单元格效果
2018/12/24 Javascript
微信小程序如何使用globalData的方法
2019/06/06 Javascript
[51:53]DOTA2-DPC中国联赛 正赛 RNG vs Dragon BO3 第二场 1月24日
2021/03/11 DOTA
Python3正则匹配re.split,re.finditer及re.findall函数用法详解
2018/06/11 Python
Tensorflow使用支持向量机拟合线性回归
2018/09/07 Python
python numpy元素的区间查找方法
2018/11/14 Python
Python多线程threading模块用法实例分析
2019/05/22 Python
如何用Python做一个微信机器人自动拉群
2019/07/03 Python
Python检查 云备份进程是否正常运行代码实例
2019/08/22 Python
python银行系统实现源码
2019/10/25 Python
Python实时监控网站浏览记录实现过程详解
2020/07/14 Python
美国网上购买眼镜:Eyeconic
2017/07/29 全球购物
什么是组件架构
2016/05/15 面试题
本科毕业生自我鉴定
2013/11/02 职场文书
高级电工工作职责
2013/11/21 职场文书
石油大学毕业生自荐信
2014/01/28 职场文书
求职信的七个关键技巧
2014/02/05 职场文书
运动会邀请函范文
2014/02/06 职场文书
机械机修工岗位职责
2014/08/03 职场文书
工人先锋号事迹材料
2014/12/24 职场文书
护士个人年终总结
2015/02/13 职场文书
javascript实现计算器功能详解流程
2021/11/01 Javascript