Rails Coffeescript 代码不起作用，但如果我在页面底部使用简单的 <script> 标记，它就会起作用

Question

我正在为一个网站制作一个简单的模式，问题是，coffescript 不工作，而如果我在底部放置一个标签，它就可以工作。我认为这是因为 coffescript 比页面先加载吗？还是完全不同？

我使用此 http://js2.coffee/ 将 javascript 转换为 coffeescript。

相关HTML:

        <div class="row home-page-pictures-container">
        <div class="col-md-10 col-md-offset-1">
            <%= image_tag("test.jpeg", id: "img1", class:"img-thumbnail") %>
            <%= image_tag("glasses-stock.jpeg", id: "img2", class:"img-thumbnail") %>
            <%= image_tag("glasses-stock.jpeg", id: "img3",  class:"img-thumbnail") %>
            <%= image_tag("glasses-stock.jpeg", id: "img4",  class:"img-thumbnail") %>
            <%= image_tag("glasses-stock.jpeg", id: "img5",  class:"img-thumbnail") %>
        </div>

        <div id="modal" class="modal-container">
            <span class="close">&times;</span>
            <img id="img-modal" class="modal-content">
            <div id="caption"></div>
        </div>
    </div>

CSS 应该没有问题，因为当我在模态的 div 中取消选中显示：none 时。它在那里。

我在这里错过了什么？

Answer 1

如果代码在文档底部的脚本标签中正常工作，但在顶部加载的文件中不能正常工作，那么您认为它的代码加载顺序是正确的。

我认为这里的问题是您在 DOM 的开头加载文件并在这些元素呈现到文档中之前绑定元素行为。没有你的代码很难说。

JQuery有办法绕过这个问题。

$(document).ready(function() {
  # waits till the document is ready to do stuff
  $('#my_elem').click(function() { 
    console.log('do stuff') 
  }
})

这会在运行您的任何代码之前等待并监听 JS 中的 DOMContentLoaded 事件。

Rails Coffeescript 代码不起作用，但如果我在页面底部使用简单的 <script> 标记，它就会起作用

Rails Coffeescript code not working, but works if I use a simple <script> tag in the bottom of my page

javascript

ruby-on-rails

coffeescript