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错误的认识不用关心内存管理
Dec 15 Javascript
JavaScript实现表格排序方法
Jun 14 Javascript
jQuery插件bgStretcher.js实现全屏背景特效
Jun 05 Javascript
jquery实现触发时更新下拉列表内容的方法
Dec 02 Javascript
实例讲解javascript注册事件处理函数
Jan 09 Javascript
AngularJs学习第八篇 过滤器filter创建
Jun 08 Javascript
不间断循环滚动效果的实例代码(必看篇)
Oct 08 Javascript
vue中用H5实现文件上传的方法实例代码
May 27 Javascript
Parcel.js + Vue 2.x 极速零配置打包体验教程
Dec 24 Javascript
使用JavaScript破解web
Sep 28 Javascript
Vue面试题及Vue知识点整理
Oct 07 Javascript
vue-router定义元信息meta操作
Dec 07 Vue.js
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
定制404错误页面,并发信给管理员的程序
2006/10/09 PHP
PHP全概率运算函数(优化版) Webgame开发必备
2011/07/04 PHP
win2003服务器使用WPS的COM组件的一些问题解决方法
2012/01/11 PHP
PHP curl 并发最佳实践代码分享
2012/09/05 PHP
php实现统计二进制中1的个数算法示例
2018/01/23 PHP
PHP过滤器 filter_has_var() 函数用法实例分析
2020/04/23 PHP
酷! 不同风格页面布局幻灯片特效js实现
2021/02/19 Javascript
webpack入门+react环境配置
2017/02/08 Javascript
数组Array的排序sort方法
2017/02/17 Javascript
详解vue-cli中的ESlint配置文件eslintrc.js
2017/09/25 Javascript
在Layui中实现开关按钮的效果实例
2019/09/29 Javascript
webpack DllPlugin xxx is not defined解决办法
2019/12/13 Javascript
JS 设计模式之:单例模式定义与实现方法浅析
2020/05/06 Javascript
Javascript实现鼠标移入方向感知
2020/06/24 Javascript
全面解析JavaScript Module模式
2020/07/24 Javascript
vue实现简单的登录弹出框
2020/10/26 Javascript
[52:20]VP vs VG Supermajor小组赛 B组胜者组决赛 BO3 第一场 6.2
2018/06/03 DOTA
[50:54]完美世界DOTA2联赛 GXR vs IO 第三场 11.07
2020/11/10 DOTA
win与linux系统中python requests 安装
2016/12/04 Python
python3.5绘制随机漫步图
2018/08/27 Python
Python OpenCV中的resize()函数的使用
2019/06/20 Python
使用IDLE的Python shell窗口实例详解
2019/11/19 Python
python中def是做什么的
2020/06/10 Python
Python使用requests模块爬取百度翻译
2020/08/25 Python
html5实现微信打飞机游戏
2014/03/27 HTML / CSS
澳大利亚首屈一指的在线购物目的地:Kogan.com
2017/02/02 全球购物
全球最大的生存食品、水和装备专用在线市场:BePrepared.com
2020/01/02 全球购物
Stührling手表官方网站:男女高品质时尚手表的领先零售商
2021/01/07 全球购物
Vector, ArrayList, HashTable, HashMap哪些是线程安全的,哪些不是
2015/10/12 面试题
临床医学专业毕业生的自我评价
2013/10/17 职场文书
大学生实习证明范本
2014/09/19 职场文书
2016大学生形势与政策心得体会
2016/01/12 职场文书
《秋天的图画》教学反思
2016/02/19 职场文书
SQL Server代理:理解SQL代理错误日志处理方法
2021/06/30 SQL Server
使用HttpSessionListener监听器实战
2022/03/17 Java/Android
MySQL提升大量数据查询效率的优化神器
2022/07/07 MySQL