Question

今天我将我的一些javascript代码迁移到了coffeescript中并陷入了一些非常愚蠢的事情，但即使我不知道如何让它发挥作用。

我想在触发点击事件时更新全局变量的值，看一下下面的代码，看看我的一个猜测

这是代码

@activeObject = null

# Some other code

$ ->
  $('#header').click ->
    if !headerSelected  
      showMenu '#header-menu', event
    else
      @activeObject = "#header"
      showMenu '#menu-style-header', event

不幸的是，即使触发了click事件，变量也没有得到更新。

我想出了一个解决方法。我创建了一个函数来设置变量的值并调用它来代替赋值，这次它起作用了。

我只是想知道为什么我无法以其他方式做到这一点。对我来说这是一个简单的操作，为此定义一个新函数似乎很愚蠢。

Answer 1

您的问题是点击处理程序中的@（AKA this）与外部不同，所以这样：

@activeObject = null

和此：

@activeObject = "#header"

指的是两个不同的activeObject。您应该能够使用=>绑定所有内容以获得正确的this：

$ =>
  $('#header').click =>
    #...

或更好（恕我直言），只需在两个地方直接引用window.activeObject，这样每个人都明白你所指的是全局变量：

window.activeObject = null
$ ->
  $('#header').click ->
    if !headerSelected  
      showMenu '#header-menu', event
    else
      window.activeObject = "#header"
      showMenu '#menu-style-header', event

或者，你可以完全停止使用全局变量来支持数据属性：

$ ->
  $('#header').data 'activeObject', null
  $('#header').click ->
    if !headerSelected  
      showMenu '#header-menu', event
    else
      $(@).data 'activeObject', '#header'
      showMenu '#menu-style-header', event

Answer 2

我认为混淆是关于@的使用，这基本上只是一个捷径。如果您编译代码并查看它产生的CoffeeScript编译器，那么混淆就会变得清晰

this.activeObject = null;

$(function() {
  return $('#header').click(function() {
    if (!headerSelected) {
      return showMenu('#header-menu', event);
    } else {
      this.activeObject = "#header";
      return showMenu('#menu-style-header', event);
    }
  });
});

如果activeObject是全局的，你可以引用它

window.activeObject = null

和

window.activeObject =“＃header”;

在这段代码中出现的两种情况都会导致人们在第二次出现时没有窗口就可能会使用它，但这会导致实现一个新的局部变量。

一般来说，从CoffeeScript开始，它可以尝试像这样的小snipets Try Now标签上的http://coffeescript.org/

无法在JQuery侦听器中修改Coffeescript的全局变量

2 个答案: