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 相关文章推荐
IE和Mozilla的兼容性汇总event
Aug 12 Javascript
Javascript alert消息换行的方法
Aug 07 Javascript
Bootstrap每天必学之轮播(Carousel)插件
Apr 25 Javascript
浅谈js中字符和数组一些基本算法题
Aug 15 Javascript
jquery dataTable 获取某行数据
May 05 jQuery
浅谈vue.js中v-for循环渲染
Jul 26 Javascript
Vue2.0学习系列之项目上线的方法步骤(图文)
Sep 25 Javascript
Javascript中绑定click事件的四种方式介绍
Oct 26 Javascript
vue-router懒加载速度缓慢问题及解决方法
Nov 25 Javascript
JS二级菜单不同实现方法分析【4种方法】
Dec 21 Javascript
pm2发布node配置文件ecosystem.json详解
May 15 Javascript
node省市区三级数据性能测评实例分析
Nov 06 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
我的论坛源代码(四)
2006/10/09 PHP
首页四格,首页五格For6.0(GBK)(UTF-8)[12种组合][9-18][版主安装测试通过]
2007/09/24 PHP
获取php页面执行时间,数据库读写次数,函数调用次数等(THINKphp)
2013/06/03 PHP
php实现粘贴截图并完成上传功能
2015/05/17 PHP
php通过前序遍历树实现无需递归的无限极分类
2015/07/10 PHP
PHP 搜索查询功能实现
2016/11/29 PHP
PHP实现查询手机归属地的方法详解
2017/04/28 PHP
thinkPHP5分页功能实现方法分析
2017/10/25 PHP
JavaScript window.setTimeout() 的详细用法
2009/11/04 Javascript
写给想学习Javascript的朋友一点学习经验小结
2010/11/23 Javascript
uploadify 3.0 详细使用说明
2012/06/18 Javascript
NodeJS学习笔记之网络编程
2014/08/03 NodeJs
JavaScript学习总结之JS、AJAX应用
2016/01/29 Javascript
javascript自动切换焦点控制效果完整实例
2016/02/02 Javascript
浅谈JavaScript中变量和函数声明的提升
2016/08/09 Javascript
Vue.js中数组变动的检测详解
2016/10/12 Javascript
js 轮播效果实例分享
2016/12/28 Javascript
使用ionic在首页新闻中应用到的跑马灯效果的实现方法
2017/02/13 Javascript
NodeJS学习笔记之Module的简介
2017/03/24 NodeJs
JavaScript运动框架 解决速度正负取整问题(一)
2017/05/17 Javascript
使用Vue构建可重用的分页组件
2018/03/26 Javascript
在angular 6中使用 less 的实例代码
2018/05/13 Javascript
浅谈Vue.js 关于页面加载完成后执行一个方法的问题
2019/04/01 Javascript
使用layui 的layedit定义自己的toolbar方法
2019/09/18 Javascript
[01:32:50]DOTA2-DPC中国联赛 正赛 DLG vs XG BO3 第一场 1月25日
2021/03/11 DOTA
python下如何查询CS反恐精英的服务器信息
2017/01/17 Python
python2.7实现FTP文件下载功能
2018/04/15 Python
Python常用数据类型之间的转换总结
2019/09/06 Python
python加密解密库cryptography使用openSSL生成的密匙加密解密
2020/02/11 Python
python logging通过json文件配置的步骤
2020/04/27 Python
Python解析m3u8拼接下载mp4视频文件的示例代码
2021/03/03 Python
亚马逊墨西哥站:Amazon.com.mx
2018/08/26 全球购物
中学门卫岗位职责
2013/12/26 职场文书
售后求职信范文
2014/03/15 职场文书
李培根演讲稿
2014/05/22 职场文书
球队口号
2014/06/18 职场文书