javascript - 在单独的 Div Jquery 中的倒数计时器时钟

Question

无法让变量 getElementById 在新元素中工作。当它在一个元素中时它是有效的，但现在试图让它们有自己的元素，这样更容易响应

http://codepen.io/riwakawebsitedesigns/pen/cqnmD

<div class="row">
<div class="block-lg-3 block-md-3 block-sm-3 block-xs-12">
<div class="module">
<h2>Days</h2>  
<div id="days"></div>
</div>
</div>
<div class="block-lg-3 block-md-3 block-sm-3 block-xs-12">
<div class="module">
<h2>Hours</h2>  
<div id="hours"></div>
</div>
</div>
<div class="block-lg-3 block-md-3 block-sm-3 block-xs-12">
<div class="module">
<h2>Minutes</h2>  
<div id="minutes"></div>
</div>  
</div>
<div class="block-lg-3 block-md-3 block-sm-3 block-xs-12">
<div class="module">
<h2>Seconds</h2>  
<div id="seconds"></div>
</div>
</div>

// set the date we're counting down to
var target_date = new Date('July, 31, 2014').getTime();

// variables for time units
var days, hours, minutes, seconds;

// get tag element
//var clock = document.getElementById('clock');
var days = document.getElementById('days');
var hours = document.getElementById('hours');
var minutes = document.getElementById('minutes');
var seconds = document.getElementById('seconds');

// update the tag with id "countdown" every 1 second
setInterval(function () {

// find the amount of "seconds" between now and target
var current_date = new Date().getTime();
var seconds_left = (target_date - current_date) / 1000;

// do some time calculations
days = parseInt(seconds_left / 86400);
seconds_left = seconds_left % 86400;

hours = parseInt(seconds_left / 3600);
seconds_left = seconds_left % 3600;

minutes = parseInt(seconds_left / 60);
seconds = parseInt(seconds_left % 60);

// format countdown string + set tag value
days.innerHTML = '<span class="days">' + days + 'Days</span>';
hours.innerHTML = '<span class="hours">' + hours + 'Hours</span>';
minutes.innerHTML = '<span class="minutes">' + minutes + 'Minutes</span>';
seconds.innerHTML = '<span class="seconds">' + seconds + 'Seconds</span>';

}, 1000);

Answer 1

您已经用包含天数的变量 days 覆盖了变量 days，这是 div 元素。

也许将 div 元素变量更改为 daysContainer。