如何将编译咖啡脚本放在我的 html 页面中答案

【问题标题】：How to put the compiled coffescript in my html page如何将编译咖啡脚本放在我的 html 页面中
【发布时间】：2013-08-23 15:14:44
【问题描述】：

我是 coffeescript 和 javascript 的新手我写了一个简单的代码 =>

 1 number = 42
  2 coffee = ->
  3     ans = confirm "Ready?"
  4     "your answer is #{ans}"

然后我将生成的 javascript 放入 html 通过单击按钮调用咖啡功能，但它没有显示警报窗口，Firebug 告诉我“ReferenceError：咖啡未定义 "

 1 <head>
  2     <script type=”text/javascript” src=”http://codeorigin.jquery.com/jquery-1.10.2.js"> </script>
  3     <script type="text/javascript" >
  4         // Generated by CoffeeScript 1.6.3
  5         $(document).ready(
  6                 function(){
  7
  8                 var coffee, fk, number;
  9
 10                 number = 42;
 11
 12                 coffee = function() {
 13                 var ans;
 14                 ans = confirm("Ready?");
 15                 return "your answer is " + ans;
 16                 };
 17                 });
 18
 19         </script>
 20     </head>
 21     <body>
 22         <input type=button name="lala" value="hihi" onclick="coffee();">
 23     </body>

【问题讨论】：

onclick="alert(coffee());" 或将警报移到代码的第 4 行。
没用~我认为问题是由于命名空间或变量范围，它显示ReferenceError：咖啡未定义

标签： coffeescript

【解决方案1】：

您将coffee 函数定义为另一个函数的局部变量，因此它在全局范围内不可用。

不建议将 onclick 事件放在 HTML 中的元素上，因此使用 jQuery 附加事件应该可以解决问题：

number = 42
coffee = ->
    ans = confirm "Ready?"
    "your answer is #{ans}"

$("input[name=lala]").on "click", coffee

【讨论】：

【解决方案2】：

您需要导出脚本中希望对外界可见的部分。

最简单的方法是这样做

window.myCoffee = {}

number = 42

myCoffee.coffee = ->
   ans = confirm "Ready?"
   "your answer is #{ans}"

那是因为脚本被包装在它自己的私有作用域中。

但由于您已经在使用 jQuery，更好的解决方案是将点击处理程序附加到 DOM 元素。

number = 42

$('input').click ->
   ans = confirm "Ready?"
   "your answer is #{ans}"

最后，从 onClick 返回一个字符串似乎没那么有用。也许alert？

【讨论】：

就像你现在做的一样。