无法运行咖啡脚本，将 <div> 类变成链接答案

【问题标题】：Unable to get coffescript running, making a <div> class into a link无法运行咖啡脚本，将 <div> 类变成链接
【发布时间】：2017-06-06 09:00:33
【问题描述】：

所以我实际上正在关注 ruby on rail 介绍视频教程... 这部分课程是要教我一些coffeescript

所以计划是让这个灰色容器跟随我的“查看答案”相同的链接

我使用的代码如下。我还被告知，因为我使用的是 turbolinks，所以我应该包括“（文档）。在“页面：加载”，准备好“行

“home.coffee”

ready = ->
$(".media").on "click", -> 
     (document).location = $(this).data("target")
     return false

$(document).ready(ready)
$(document).on "page:load", ready

但是，经过测试。单击灰色容器，什么也不做。我是否缺少某种脚本才能使其正常工作？早些时候我在咖啡脚本上测试了 Console.log("TEST") ，它能够在 chrome 的检查中打印出来。

我的页面的当前布局

<!DOCTYPE html>
<html>
<head>
  <title>PROJECT HU</title>
<!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
  <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>


  <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
  <script data-require="jquery@*" data-semver="2.1.3" src="https://code.jquery.com/jquery-2.1.3.min.js"></script>

  <%= csrf_meta_tags %>
</head>

<body>
    <%= render 'home/navbar' %>

    <%= yield %> <!-- yield is content of the html-->
    <%= render 'home/new_question_form' %>

</body>

</html>

索引页面如下 根据我的教程，我必须添加这个 data-target="" 进入媒体

<div class = "well">
    <h1>WELCOME LA</h1>
</div>
<div class='container'>
<!--#loop this html as much as number of question in the database-->
    <div class="boxes">
        <% @questions.each do |q|%> 
            <div class="media" data-target="<%= question_path(q) %>">
                    <div class="media-left">
                    <a href="#">
                        <img class="media-object" src="<%= q.gravatar%>" alt="sampleImg">

                    </a>
                    </div>
                    <div class="media-body">
                        <h4 class="media-heading"><%= q.email%> asked : </h4>
                        <div class="time"><%= time_ago_in_words q.created_at%></div>
                        <%= q.body %>
                    </div>

                    <div>
                        <a href= "<%= question_path(q)%>" class="btn btn-success btn-xs">View Answers</a>
                    </div>
            </div>
        <%end%>
    </div>
    <% if @questions.empty? %>
        <div class="alert alert-info">Ooops.... There's no questions here.</div>
    <% end %>
</div>

【问题讨论】：

标签： jquery ruby-on-rails-3 coffeescript

【解决方案1】：

如果这是你真正的缩进：

ready = ->
$(".media").on "click", -> 
     (document).location = $(this).data("target")
     return false

那么您的 ready 函数为空。它的 JavaScript 版本（或多或少）是这样的：

var ready = function() { };
$(".media").on("click", function() {
     (document).location = $(this).data("target")
     return false
});

您的缩进定义了 CoffeeScript 代码的块结构，因此您必须正确：

ready = ->
  $('.media').on 'click', -> 
    document.location = $(@).data('target')
    false

此外，CoffeeScript 函数返回其最后一个表达式的值（就像在 Ruby 中一样），因此当函数的最后一行时，return false 可以只是 false。

【讨论】：

非常感谢您对如何翻译的解释。它让我对正在发生的事情有了更清晰的认识。

【解决方案2】：

看看你的coffeescript，有几处不对：

ready = ->
$(".media").on "click", -> 
     (document).location = $(this).data("target")
     return false

$(document).ready(ready)
$(document).on "page:load", ready

第 2 行应缩进
无需将document 括在括号中；您是否尝试将其包装在 jQuery 对象中？
在 CoffeeScript 中，您只需将 false 放在函数或闭包的最后一行，它就会被返回

假设您的缩进是正确的，并且.media 具有data-target 属性，您可能需要验证您的点击处理程序是否被触发。快速破解的方法是在其中快速调用console.log，但您也可以使用调试器创建断点（更强大）。我首先要确保：

$(".media") 符合您的预期
您的ready 闭包在点击时被调用
$(this).data("target") 返回您期望的值

如果第 2 条没有发生，您可以开始查看您的 page:load 绑定；也许 Turbolinks 没有加载，或者你没有使用当前版本？

注意：您不想同时绑定到ready 和page:load，否则您将注册两个点击处理程序。在最新的 TurboLinks 中，page:load 将适当地处理页面加载和 TurboLinks 导航。

【讨论】：

哦，我的.....所以这是因为我没有缩进它，代码不起作用......也感谢其他提示，下次它肯定会帮助我！谢谢！
如果你们不介意再次提供帮助.. 这是我的困境的另一个链接...stackoverflow.com/questions/41787739/…