I have a countdown, but to no avail, I could not get the date too, in that countdown is only Hour, Minutes and Seconds, I wanted the Days too.
Code:
link
$(function () {
setInterval(function () {
$('.countdown').each(function (index, value) {
var data = $(this).attr('data-expire').split(' ');
var date = data[0].split('-');
var hour = data[1].split(':');
var dateEnd = new Date(date[0], date[1] - 1, date[2], hour[0], hour[1], hour[2]);
var dateNow = new Date();
dateNow.setMilliseconds(0);
if (dateEnd.getTime() >= dateNow.getTime()) {
dateEnd.setDate(dateEnd.getDate() - dateNow.getDate());
dateEnd.setHours(dateEnd.getHours() - dateNow.getHours());
dateEnd.setMinutes(dateEnd.getMinutes() - dateNow.getMinutes());
dateEnd.setSeconds(dateEnd.getSeconds() - dateNow.getSeconds());
var setDate = dateEnd.getDate();
if (dateEnd.getDate().toString().length === 1) {
var setDate = '0' + dateEnd.getDate();
}
var setHours = dateEnd.getHours();
if (dateEnd.getHours().toString().length === 1) {
var setHours = '0' + dateEnd.getHours();
}
var setMinutes = dateEnd.getMinutes();
if (dateEnd.getMinutes().toString().length === 1) {
var setMinutes = '0' + dateEnd.getMinutes();
}
var setSeconds = dateEnd.getSeconds();
if (dateEnd.getSeconds().toString().length === 1) {
var setSeconds = '0' + dateEnd.getSeconds();
}
$(this).find('.days').html(setDate);
$(this).find('.hours').html(setHours);
$(this).find('.minutes').html(setMinutes);
$(this).find('.seconds').html(setSeconds);
} else {
location.reload();
}
});
}, '1000');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divclass="countdown" data-expire="2018-08-30 10:00:00">
<div>
<span>
Oferta<br/>
<span class="countdown_legend">Acaba em:</span>
</span>
</div>
<div>
<span>
<span class="days">00</span> : <br/>
<span class="countdown_legend">Days</span>
</span>
<span>
<span class="hours">00</span> : <br/>
<span class="countdown_legend">Hrs</span>
</span>
<span>
<span class="minutes">00</span> : <br/>
<span class="countdown_legend">Min</span>
</span>
<span>
<span class="seconds">00</span><br/>
<span class="countdown_legend">Seg</span>
</span>
</div>
</div>