Coffeescript-如何在RubyonRails中将javascript转换为Coffeescript？

我在

test.html.erb

中的视图中有一个按钮，如下所示

<button  id="Todo_full" onclick="showFullscreen(this);">Full size</button>

当我将javascript代码保存在

test.html.erb

文件的下面时，它工作得很好。 当我通过将此代码转换为coffeescript并将代码保存在

app/assets/javascript/test.coffee

中时，如下所示：

    function showFullscreen(event)
    {
    var elem = document.getElementById('card_' + event.id);

        if (elem.requestFullscreen) {
        return elem.requestFullscreen();
        }
        else if (elem.mozRequestFullScreen) 
        {

        /* Firefox */
        return elem.mozRequestFullScreen();
        }
    } 

showFullscreen = (event) ->
  elem = document.getElementById('card_' + event.id)
  if elem.requestFullscreen
    return elem.requestFullscreen()
  else if elem.mozRequestFullScreen

    ### Firefox ###

    return elem.mozRequestFullScreen()
  return

它在控制台中显示一个错误

Uncaught ReferenceError: showFullscreen is not defined
    at HTMLButtonElement.onclick ((index):384)

即使在coffeescript的代码顶部使用

window.onload=->

时，控制台中也会出现相同的错误

---

谢谢

您遇到的问题是JS和CoffeeScript之间的不同范围。要使代码正常工作，您需要在

窗口

或CoffeeScript速记

@

上全局地确定功能范围

从：

如果要创建顶级变量供其他脚本使用， 将它们作为属性附加到

窗口

对于您的函数，它看起来像：

#使用窗口
window.showFullscreen=（事件）->
elem=document.getElementById（'card_u'+event.id）
...
#或使用@
@全屏显示=（事件）->
elem=document.getElementById（'card_u'+event.id）
...

CoffeeScript

@

是JavaScript中

this

的简写。因此，在您的示例中，因为您在顶层窗口scope

window==@

定义函数。请记住，在您的函数中，作用域将是不同的，

window！=@

，而

@

将被限定在函数中的

范围内

说到
这个
，CoffeeScript有一个快捷方式，
@
符号。
很容易把它写成毫无意义的语法糖，但是
这是有用的。首先，将转换前缀为
@
的构造函数参数
进入属性：

#咖啡脚本
类用户
构造函数：（@id）->

//JavaScript
功能用户（id）{
this.id=id；
}

除此之外，这是定义类方法的好方法：

#咖啡脚本
类用户
构造函数：（@id）->
@findById：（id）=>
...

//JavaScript
功能用户（id）{
this.id=id；
}
User.findById=function（）{}；

无论是
@
还是胖箭头
=>
都不意味着你不必担心
此
（或其别名
@
）的当前含义。它们不是银的
子弹，这并不是说它们没有增值

这些代码片段并不完全相同。JavaScript-one正在定义一个全局
showFullscreen
函数，而CoffeeScript-one在作用域包装器中创建一个本地
showFullscreen
函数。也许您想说
@showFullScreen=（事件）->…
或
window.showFullScreen=（事件）->…
。或者更好的做法是，根本不要使用
onclick
属性，创建本地函数并将它们绑定到元素。感谢回复兄弟，但我现在停止了ror技术的工作。Awww bummer@shashiverma！RoR仍然是我的最爱：-）如果你认为这个答案很有帮助，你能为未来的观众指出正确的答案吗？出于好奇，您现在使用的是什么技术？当然，为什么不呢？我已经在ror中创建了一个管理模板，但我总是混淆管道、CoffeeScript，我们应该按照什么顺序导入（或需要）库。现在我正在开发一个javascript框架vuejs。