文档章节

js得到两个日期之间间隔的天数

phantome
 phantome
发布于 2014/04/15 13:43
字数 397
阅读 28
收藏 0
好长时间没更新了,最近有项目在做,进度不容忽视啊⊙﹏⊙,这边儿就在睡觉之前把这个js算日期的间隔发一发,想着可能后面项目中会用到也说不定,赶紧的吧。老习惯,先上效果图:

 



                                             图一



                                               图二

 

 

      这边儿例子和效果就比较单一了,就是输入个时间,或者你用jquery的时间控件,选了个时期上面了,然后你想得到这个选择的日期之间的间隔时间,比如天数,小时,分,甚至是秒,我这里是算的小时,算天除个24,算分成个60等等,这个我不赘述了,代码如下[各类需求请参照着代码自行改动]:

Html代码
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
  5. <title>无标题文档</title>  
  6. <script type="text/javascript">  
  7. window.onload = function() {  
  8. document.getElementById('btn_calc').onclick = function() {  
  9. var obj = document.getElementById('demo').getElementsByTagName('input');  
  10.   
  11. var ar_ds = obj[0].value.split('-');  
  12. var ar_ts = obj[1].value.split(':');  
  13. var ds = new Date(ar_ds[0], ar_ds[1] - 1, ar_ds[2], ar_ts[0], ar_ts[1]);   
  14.   
  15. var ar_de = obj[2].value.split('-');  
  16. var ar_te = obj[3].value.split(':');  
  17. var de = new Date(ar_de[0], ar_de[1] - 1, ar_de[2], ar_te[0], ar_te[1]);   
  18.   
  19. var result = de.getTime() - ds.getTime();  
  20.   
  21.   
  22. document.getElementById('result').innerHTML = '请假时间:' + (result / 3600000).toFixed(1) + '小时';  
  23. }  
  24. }  
  25. </script>  
  26. </head>  
  27.   
  28. <body>  
  29. <div id="demo">  
  30. 开始日期:<input type="text" value="2012-05-23" />&nbsp;开始时间:<input type="text" value="08:30" /><br />  
  31.     结束日期:<input type="text" value="2012-05-24" />&nbsp;结束时间:<input type="text" value="17:30" /><br />  
  32.     <button id="btn_calc">计算</button>  
  33. </div>  
  34. <div id="result"></div>  
  35. </body>  
  36. </html> 

© 著作权归作者所有

phantome
粉丝 17
博文 280
码字总数 328011
作品 0
浦东
程序员
私信 提问
js中的date.parse函数

js Date对象的 parse()用法: parse:解析一个包含日期的字符串,并返回该日期与1970年1月1日午夜之间所间隔的毫秒数。 Date.parse(dateVal) 其 中必选项 dateVal 是一个包含以诸如 "Jan 5, ...

王锐
2012/10/24
19.2K
2
vue/uni-app之空手撕日历

前言 项目需要,没有合适的轮子,所以,,, 效果(红圈部分): 需求 日期对应星期显示 今天包括今天之前禁用 某产品的最短预定时间内禁用,如提前三天,则今天明天后天禁用 日期下面显示对...

在足各上
06/21
0
0
js时间Date对象介绍及解决getTime转换为8点的问题

前言   在做时间转换的时候,发现用“2016-04-12”转出来的时间戳是 2016-04-12 08:00的时间点,而不是0点。 new Date('2016-04-12').getTime();// 1460419200000 new Date(1460419200000......

Jack088
01/16
248
0
JavaScript 工作线程实现方式

随着 Ajax 应用的流行,浏览器所承担的职责也越来越多。一些原来由服务器端执行的计算操作也被迁移到浏览器端来执行。通过 JavaScript 工作线程,可以在不影响页面本身运行的情况下,在后台运...

IBMdW
2011/05/27
340
0
JS 在获取当前月的最后一天遇到的坑

想阅读更多优质文章请猛戳GitHub博客,一年百来篇优质文章等着你! 为了更好的讲这节的内容,提示一个 JS 处理日期的小技巧,想获取上个月最后一天,只需要设置SetDate参数为0即可。 接着正文...

前端小智
08/22
0
0

没有更多内容

加载失败,请刷新页面

加载更多

rime设置为默认简体

转载 https://github.com/ModerRAS/ModerRAS.github.io/blob/master/_posts/2018-11-07-rime%E8%AE%BE%E7%BD%AE%E4%B8%BA%E9%BB%98%E8%AE%A4%E7%AE%80%E4%BD%93.md 写在开始 我的Arch Linux上......

zhenruyan
今天
5
0
简述TCP的流量控制与拥塞控制

1. TCP流量控制 流量控制就是让发送方的发送速率不要太快,要让接收方来的及接收。 原理是通过确认报文中窗口字段来控制发送方的发送速率,发送方的发送窗口大小不能超过接收方给出窗口大小。...

鏡花水月
今天
10
0
OSChina 周日乱弹 —— 别问,问就是没空

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @tom_tdhzz :#今日歌曲推荐# 分享容祖儿/彭羚的单曲《心淡》: 《心淡》- 容祖儿/彭羚 手机党少年们想听歌,请使劲儿戳(这里) @wqp0010 :周...

小小编辑
今天
1K
11
golang微服务框架go-micro 入门笔记2.1 micro工具之micro api

micro api micro 功能非常强大,本文将详细阐述micro api 命令行的功能 重要的事情说3次 本文全部代码https://idea.techidea8.com/open/idea.shtml?id=6 本文全部代码https://idea.techidea8....

非正式解决方案
今天
5
0
Spring Context 你真的懂了吗

今天介绍一下大家常见的一个单词 context 应该怎么去理解,正确的理解它有助于我们学习 spring 以及计算机系统中的其他知识。 1. context 是什么 我们经常在编程中见到 context 这个单词,当...

Java知其所以然
昨天
9
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部