【问题标题】:Make a datetime countdown timer in rails在 Rails 中制作日期时间倒数计时器
【发布时间】:2017-02-08 01:50:22
【问题描述】:

您好,我非常接近制作这个日期时间计数器。我假设因为我在我的代码中使用date new Date 我没有让代码工作?我想使用datedatetimetime吗?当我做一个`puts“#{reservation.due_date}”时,我得到了正确的截止日期,所以我很困惑为什么计数器不工作。

 

<div id="dueDate-counter">
   <table>
    	<tr>
    		<td>days</td>
    		<td>hrs</td>
    		<td>mns</td>
    		<td>secs</td>
    	</tr>
    	<tr>
    		<td id="days"></td>
    		<td id="hours"></td>
    		<td id="minutes"></td>
    		<td id="seconds"></td>
    	</tr>
    								
    </table> 

    	<script type="text/javascript">
    		function countdown() {
    			var now = new Date();
    			var eventDate = new Date(<%= reservation.due_date %>);
    			<%= puts "here is reservation !!!!!!!" %>;
    			<%= puts "#{reservation.due_date}" %>;
    			var currentTime = now.getTime();
    			var eventTime = eventDate.getTime();

    			var remTime = eventTime - currentTime;

    			var s = Math.floor(remTime / 1000);
    			var m = Math.floor(s / 60);
    			var h = Math.floor(m / 60);
    			var d = Math.floor(h / 24);

    			h %= 24;
    			m %= 60;
    			s %= 60;

    			h = (h < 10) ? "0" + h : h;
    			m = (m < 10) ? "0" + m : m;
    			s = (s < 10) ? "0" + s : s;

    			document.getElementById("days").textContent = d;
    			document.getElementById("days").innerText = d;

    			document.getElementById("hours").textContent = h;
    			document.getElementById("minutes").textContent = m;
    			document.getElementById("seconds").textContent = s;

    				setTimeout(countdown, 1000);
    								}

    								countdown();

    							</script>
    							
    						</div>

查看页面时,我得到空白数据以显示在 days hours etc 中。在script 的开头附近我添加了eventDate 我把due_date 作为一个新的日期.. 现在记住它的日期时间格式,所以它在数据库中有小时分钟秒。所以这不是因为我做了new Date所以没有阅读datetime有一个吗?谢谢!!

reservation.due_date 显示在数据库中,例如:2017-02-09 00:02:00

【问题讨论】:

    标签: javascript html ruby-on-rails datetime timer


    【解决方案1】:

    你只需要用报价包装一个到期日期的输出

    var eventDate = new Date("<%= reservation.due_date %>");
    

    如果不这样做,您将在控制台浏览器上收到此错误

    Uncaught SyntaxError: missing ) after argument list

    【讨论】:

      猜你喜欢
      • 2021-02-03
      • 2019-06-04
      • 1970-01-01
      • 2022-01-05
      • 1970-01-01
      • 2022-11-28
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多