如何在Ruby on Rails视图中调用JavaScript函数？

没问题，我来一步步帮你搞定这个倒计时的调用：

1. 确保Rails正确加载你的JS文件 #

因为你的countdown.js放在app/assets/javascripts/目录下，Rails默认的资产管道会自动处理，但要确认app/assets/javascripts/application.js里包含了以下其中一行（确保你的文件被加载）：

• 如果用require_tree .：这会加载该目录下所有JS文件，已经包含了你的countdown.js
• 或者单独引入：//= require countdown

2. 在index.html.erb中添加倒计时显示元素 #

你的JS代码里是通过document.getElementById("countdown")来更新内容的，所以必须在页面里添加对应id的元素，比如在你想显示倒计时的位置插入：

<p>剩余时间: <span id="countdown"></span> 秒</p>

3. 调用countdown函数 #

为了避免DOM还没渲染完成就执行JS（导致找不到countdown元素），推荐在DOM加载完成后调用函数。你有几种选择：

选项1：原生JS的DOMContentLoaded事件 #

在index.html.erb里添加script标签，或者把这段代码加到countdown.js的末尾：

document.addEventListener('DOMContentLoaded', function() {
  countdown();
});

选项2：把调用放在页面底部 #

如果你把script标签放在index.html.erb的</body>标签之前，也可以直接调用：

<script>
  countdown();
</script>

选项3：用jQuery（如果你的Rails项目引入了jQuery） #

<script>
  $(document).ready(function() {
    countdown();
  });
</script>

小提示：完善你的倒计时逻辑 #

看了你的JS代码，发现两个小问题可以优化：

• 拼写错误：Chnage应该改成Change
• 倒计时结束后的跳转逻辑缺失：当seconds < 0时，你重置了seconds但没有跳转，应该加上跳转代码，比如：

if (seconds < 0) {
  // 修改成你的跳转链接
  window.location.href = '/your-target-page';
  return; // 停止后续执行
}

这样调整后，你的倒计时就能正常在index.html.erb里运行啦！

内容的提问来源于stack exchange，提问作者Bruno Lopes Bacelar