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 的 prototype问题。
Jan 03 Javascript
js利用div背景,做一个竖线的效果。
Nov 22 Javascript
基于jquery的气泡提示效果
May 31 Javascript
window.onload和$(function(){})的区别介绍
Oct 30 Javascript
jquery ajax局部加载方法详解(实现代码)
May 12 Javascript
Knockout结合Bootstrap创建动态UI实现产品列表管理
Sep 14 Javascript
JavaScript实现网页头部进度条刷新
Apr 16 Javascript
vue将时间戳转换成自定义时间格式的方法
Mar 02 Javascript
在Web关闭页面时发送Ajax请求的实现方法
Mar 07 Javascript
微信小程序实现拍照画布指定区域生成图片
Jul 18 Javascript
layui 解决富文本框form表单提交为空的问题
Oct 26 Javascript
微信小程序组件生命周期的踩坑记录
Mar 03 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
提高PHP编程效率 引入缓存机制提升性能
2010/02/15 PHP
PHP校验ISBN码的函数代码
2011/01/17 PHP
smarty模板判断数组为空的方法
2015/06/10 PHP
PDO::prepare讲解
2019/01/29 PHP
Thinkphp 框架扩展之驱动扩展实例分析
2020/04/27 PHP
ExtJs3.0中Store添加 baseParams 的Bug
2010/03/10 Javascript
推荐40款强大的 jQuery 导航插件和教程(上篇)
2012/09/14 Javascript
js设置文本框中焦点位置在最后的示例代码(简单实用)
2014/03/04 Javascript
用JS在浏览器中创建下载文件
2014/03/05 Javascript
一个html5播放视频的video控件只支持android的默认格式mp4和3gp
2014/05/08 Javascript
JavaScript中实现PHP的打乱数组函数shuffle实例
2014/10/11 Javascript
IE6浏览器中window.location.href无效的解决方法
2014/11/20 Javascript
Javascript URI 解析介绍
2015/03/15 Javascript
深入学习JavaScript中的原型prototype
2015/08/13 Javascript
基于canvas粒子系统的构建详解
2017/08/31 Javascript
Express系列之multer上传的使用
2017/10/27 Javascript
Vue.use源码学习小结
2018/06/20 Javascript
jQuery实现获取form表单内容及绑定数据到form表单操作分析
2018/07/03 jQuery
seajs和requirejs模块化简单案例分析
2019/08/26 Javascript
Vue实现星级评价效果实例详解
2019/12/30 Javascript
基于Python的接口测试框架实例
2016/11/04 Python
Python实现PS滤镜功能之波浪特效示例
2018/01/26 Python
对numpy中轴与维度的理解
2018/04/18 Python
python实现对求解最长回文子串的动态规划算法
2018/06/02 Python
python print输出延时,让其立刻输出的方法
2019/01/07 Python
Python mutiprocessing多线程池pool操作示例
2019/01/30 Python
python mqtt 客户端的实现代码实例
2019/09/25 Python
Python selenium爬虫实现定时任务过程解析
2020/06/08 Python
分享CSS3制作卡片式图片的方法
2016/07/08 HTML / CSS
南威尔士家居商店:Leekes
2016/10/25 全球购物
鞋子女王塔玛拉·梅隆同名奢侈品牌:Tamara Mellon
2017/11/22 全球购物
旷课检讨书2000字
2014/01/14 职场文书
篮球赛口号
2014/06/18 职场文书
关于运动会的广播稿
2015/08/19 职场文书
只需要100行Python代码就可以实现的贪吃蛇小游戏
2021/05/27 Python
Pygame如何使用精灵和碰撞检测
2021/11/17 Python