点击事件上的CoffeeScript无效

时间:2017-03-16 20:07:15

标签: javascript jquery html css coffeescript

我是CoffeeScript和JS的新手。我正在尝试在单击div时创建警报,但我不确定为什么我的代码不起作用。所有这些文件都在同一目录中。

first.coffee

$('#button').on 'click', -> alert 'Hello World!'

我在button之前使用和不使用哈希尝试了这个。

编译完成后:

first.js

// Generated by CoffeeScript 1.12.4
(function() {
  $('#button').on('click', function() {
    return alert('Hello World!');
  });

}).call(this);

HTML看起来像这样。我已经尝试将脚本移动到标题中,但我认为这不会产生影响。

first.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>CoffeeScript</title>
        <link rel="stylesheet" type="text/css" href="first.css">
    </head>
    <body>
        <div id='button'></div>
        <script src='first.js'></script>
    </body>
</html>

div的造型:

first.css

#button {
    width: 100px;
    height: 100px;
    background-color: black;
}

1 个答案:

答案 0 :(得分:0)

您需要在脚本

之前添加对jQuery javascript库的引用
<body>
    <div id='button'></div>
    <script src='/path/to/jquery-3.1.1.min.js'></script>
    <script src='first.js'></script>
</body>

您需要将jQuery下载到您的系统并提供正确的路径。