我现在正在转向使用Coffeescript编写我的所有
javascript代码,但我很沮丧因为最简单的例子导致我出现问题.截至目前,我已经做了一个多小时的研究而没有找到答案…
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <script src="http://jashkenas.github.com/coffee-script/extras/coffee-script.js" type="text/javascript" charset="utf-8"></script> <link href="sheet.css" rel="stylesheet" type="text/css" media="screen" /> <script type="text/coffeescript"> $-> sayHi() sayHi = -> alert 'Hi there!' </script> </head> <body> <div id="all"> </div> </body> </html>
从上面的代码可以清楚地看出,我只是试图从jQuery的ready处理程序中调用sayHi()函数.但我得到的错误如下:
未捕获的TypeError:undefined不是函数
请帮助我,根据编译器和教程,我已经读过这个’应该’的工作,但我不知道我在做什么可怕的错误为此不运行:(
解决方法
text / coffeescript标签与text / javascript标签有很大的不同.在文档加载之前,它们不会“运行”.这是因为咖啡脚本库必须找到所有咖啡脚本标签并进行编译,并且必须等到DOM准备好才能确保全部找到它们.
另一个问题是,如果事件已经发生,jQuery将立即触发DOM ready回调.在这种情况下,它有.
所以当这个编译成JS时你得到这个:
var sayHi; $(function() { return sayHi(); }); sayHi = function() { return alert('Hi there!'); };
那么会发生什么:
>声明sayHi变量没有值,使其未定义.
>为使用此变量的jQuery创建DOM ready回调.
> jQuery立即运行回调函数,因为DOM就绪已经发生.
>回调函数执行,并尝试运行仍未定义的sayHi().
>回调运行后,然后将sayHi设置为您要运行的函数.
现在,如果这是一个普通的JS标记,它可能在文档加载之前运行,然后它就可以正常工作,因为回调实际运行的时间,然后sayHi将被正确分配.
要修复它,您应该在回调中运行pass之前分配函数.或者你可以完全跳过$( – >),因为你已经知道DOM已经被解雇了.但实际上,这是你真的不应该使用coffeescript标签的一个主要原因.它与使用JS标签真的不一样.其中一个原因是,这不是在真实网站上使用CoffeeScript的推荐方法.
所以在您的浏览器看到它像负责任的开发人员之前编译您的咖啡脚本