计算年数:月:剩余天数

时间:2016-09-06 17:14:38

标签: jquery

尝试计算2个日期之间剩余的时间

我认为我很接近,但是我的日子和年份都有错误的结果,我已经检查了其他解决方案,但它们与我尝试做的方式有所不同...我可以用我的方式做我需要的方式我在做什么?

var seconds= Math.floor((timeLeft/1000)%60);
var minutes= Math.floor((timeLeft/(1000*60))%60);
var hours= Math.floor((timeLeft/(1000*60*60))%24);
var dayz= Math.floor((timeLeft/(1000*60*60*24))%31);
var years= Math.floor((timeLeft/(1000*60*60*24*31))%12);



$(document).ready(function(){

var currentDate = new Date(2017, 08, 07 , 14 , 33, 20); //set fixed dates to test with
var futureDate = new Date(2018, 08, 07 , 14 , 33, 20); //set fixed dates to test with

var countDown = setInterval(function() {
  
  
			var currentD = new Date(2017, 08, 07 , 14 , 33, 20); //set fixed dates to test with
			var timeLeft = new Date();
			timeLeft = futureDate - currentD;
  
            var seconds= Math.floor((timeLeft/1000)%60);
			var minutes= Math.floor((timeLeft/(1000*60))%60);
			var hours= Math.floor((timeLeft/(1000*60*60))%24);
			var dayz= Math.floor((timeLeft/(1000*60*60*24))%31);
            var years= Math.floor((timeLeft/(1000*60*60*24*31))%12);
  
  
      $('#timeLeft').text(years + " " + dayz + " " + hours + " " + minutes + " " + seconds);

  
  
}, 1000);


  $('#currentDate').text( currentDate);
  $('#futureDate').text(futureDate);  
  
  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Current Date: <span id="currentDate"></span><br/>
Future Date: <span id="futureDate"></span><br/>
Time till: <span id="timeLeft"></span><br/>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:0)

我建议改用momentjs。它会让事情变得非常简单......下面会给你几天的差异,但是你可以轻松地为你的差异提供各种可能的格式:

var currentDate = moment([2017, 8, 7 , 14 , 33, 20]); //set fixed dates to test with
var futureDate = moment([2018, 8, 7 , 14 , 33, 20]);
var format = "YYYY-MM-DD HH:mm:ss";
document.getElementById("currentDate").appendChild(document.createTextNode(currentDate.format(format)));
document.getElementById("futureDate").appendChild(document.createTextNode(futureDate.format(format)));

var difference = futureDate.diff(currentDate, 'days', true);
var durationReadable = moment.duration(futureDate.diff(currentDate)).humanize(true);

document.getElementById("timeLeft").appendChild(document.createTextNode(difference));
document.getElementById("duration").appendChild(document.createTextNode(durationReadable));
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.14.1/moment-with-locales.min.js"></script>

Current Date: <span id="currentDate"></span><br/>
Future Date: <span id="futureDate"></span><br/>
Time till: <span id="timeLeft"></span><br/>
Time till humanized: <span id="duration"></span>

答案 1 :(得分:0)

我明白了, 对于像我这样的菜鸟来说,这是一个解决方案。

$(document).ready(function(){
var showOne = new Date();
var showTwo = new Date(2016, 08, 14);
$('#showOne').text( showOne);  
$('#showTwo').text( showTwo );


setInterval(function(){
var currentDateSec = $.now() / 1000 ;
var laterDate = showTwo;
var laterDateSec = laterDate / 1000;
var timeLeft = laterDateSec - currentDateSec;

var sLeft = Math.floor(timeLeft) %60;
var mLeft = Math.floor(timeLeft/(60)) %60;
var hLeft = Math.floor(timeLeft/(60 * 60)) %24;
var dLeft = Math.floor(timeLeft/(60 * 60 * 24)) %7;
var wLeft = Math.floor(timeLeft/(60 * 60 * 24 * 7));


  $('#currentDate').text( currentDateSec);  
  $('#futureDate').text(laterDateSec);
  $('#timeLeft').text(timeLeft);
  
  $('#sLeft').text(sLeft);
  $('#mLeft').text(mLeft);
  $('#hLeft').text(hLeft);
  $('#dLeft').text(dLeft);
  $('#wLeft').text(wLeft);
  
$('#humandate').text(wLeft + " Weeks - " + dLeft + " Days - " + hLeft + " Hours - " + mLeft + " Mins - " + sLeft + " Sec\(s\)");
  
  
}, 1000);

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span id="showOne"></span><br/>
<span id="showTwo"></span><br/>
<br/><br/>
Current Date: <span id="currentDate"></span><br/>
Future Date: <span id="futureDate"></span><br/>
Seconds till: <span id="sLeft"></span><br/>
Mins till: <span id="mLeft"></span><br/>
Hours till: <span id="hLeft"></span><br/>
Days till: <span id="dLeft"></span><br/>
Weeks till: <span id="wLeft"></span><br/>
<br/><br/>
<span id="humandate"></span><br/>