2017-03-16 15 views
0

CoffeeScriptとJSの新機能です。私はdivがクリックされたときに警告を作成しようとしていますが、私のコードがなぜ機能していないのか分かりません。これらのファイルはすべて同じディレクトリにあります。クリックイベントのCoffeeScriptが機能しない

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のためのスタイリング:あなたはjQueryのJavaScriptのライブラリへの参照を追加する必要があります

first.css

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

答えて

0

あなたのスクリプトの前に

<body> 
    <div id='button'></div> 
    <script src='/path/to/jquery-3.1.1.min.js'></script> 
    <script src='first.js'></script> 
</body> 

システムにjQueryをダウンロードし、正しいパスを提供する必要があります。

+0

ありがとう、これはそれを解決しました! –

関連する問題