如何在Rails 3.1中使用CoffeeScript注册JQuery点击事件

Question

我试图做一件似乎很简单但却总让我摸不着头脑的事情。我想在我的tasks.js文件中为链接添加一个点击事件，就像这样：

$ ->
  $('.cancel_task').click -> 
    $('#task_form').toggle

这将呈现为：

(function() {
  $(function() {
    return $('.cancel_task').click(function() {
    return $('#task_form').toggle;
  });
});
}).call(this);

我想要的只是类似于：

$('.cancel_task').click(function()
{
  $('#task_form').toggle();
});

如何使用CoffeeScript和Rails 3.1堆栈完成这个任务？

- Beau

Answer 1

在JavaScript中，CoffeeScript旨在将您的所有操作限制在有限的范围内，这样您就不会用全局变量填充世界。这很有用，除非您拥有它，请勿忽略此问题。在顶层，您可以使用this.something = "value"进行导出。

现在，您上面的代码无法正常工作，因为函数调用需要添加一个括号来表示没有参数。这将使得这两个片段功能上相同。在JavaScript中，函数是变量，所以当您没有使用括号时，它会认为您想要返回该函数本身而不是其结果。

$ ->
  $('.cancel_task').click -> 
    $('#task_form').toggle()

最后，Coffee函数总是返回函数的最后一个值。这就是它的工作方式。因此，不要担心return语句，您始终可以忽略结果。

- Travis

---

不，你不能总是忽略结果，这是不正确的。我刚遇到了这个问题。我在复选框上挂钩了click()事件。除此之外，click()还会通过variable = !variable来切换一个布尔值。这段代码放在函数的最后。当然，这会导致奇怪的行为，导致用户需要点击两次才能切换复选框。这就是不使用隐式返回的危险所在。 - Ostemar

Answer 2

你发布的第二个代码片段是coffee的正确输出，而你发布的第二个和最后一个代码片段在实际上是功能等效的。如果你想要摆脱顶层闭包，可以使用coffee的--bare选项（这是有文档记录的），但除此之外，你不必担心CoffeeScript的输出，除非它给你带来了问题。

- Jordan Running

---

问题是它没有起作用。有任何想法为什么会这样？ - Beau

像调试其他 JavaScript 一样调试它。jQuery 是否已加载（我假设 $ 就是从那里来的）？你的事件是否触发？你的事件监听器是否被注册？你的选择器是否正确？只需按照与普通 JavaScript 相同的步骤进行，即在 Firebug/Web Inspector 中使用断点或仅使用 console.log。 - Jordan Running