javascript - 在 Rails 中制作日期时间倒计时器

标签 javascript html ruby-on-rails datetime timer

你好,我很快就要制作这个日期时间计数器了。我假设因为我在代码中使用 date new Date 我无法让代码正常工作?我应该使用 date datetime time 吗?当我进行“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>

在查看页面时,我在 小时 内显示空白数据。在 script 的开头附近添加了 eventDate 我将 due_date 作为新日期放入。现在记住它是 DateTime 格式,所以它数据库中有小时分钟秒。那么这不是因为我创建了new Date而没有读取吗?有一个datetime吗?谢谢!!

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

最佳答案

您只需要用报价包装到期日期的输出

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

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

未捕获的语法错误:参数列表后缺少 )

关于javascript - 在 Rails 中制作日期时间倒计时器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42103306/

相关文章:

javascript - 将字体系列从 Assets 动态加载到 WebView 中

javascript - $.ajax 显示 "�"而不是重音符号,例如 "é"或 "ã"

javascript - 使用 JavaScript 将数组和文件对象提交到 Rails 后端

ruby-on-rails - 将临时更改推送到 heroku,然后删除它们(从 gi​​t)

javascript - 警告 : validateDOMNesting(…): <form> cannot appear as a descendant of <form> by using semantic-ui-react modal

javascript - 如何获取元素嵌套项

javascript - click() 方法适用于链接,但不适用于 Javascript 中的按钮

javascript - 使用 php 和 onclick 函数下载 pdf

JavaScript - 在所有创建的 li 元素上添加事件监听器

ruby-on-rails - 如何显示在 Rails 控制台中运行的 SQL 查询?