2012-01-15 11 views
20

Coffeescriptで自分のサイトのフロントエンドを書き直しに取り組んでいます。クリック機能をクラスにバインドする方法を理解しています。CoffeeScript - バインディングJQueryで動的にロードされたオブジェクトへのイベントをクリックします。

$('.song').click -> 
    //code 

しかし、私は動的に読み込まれたコンテンツにいくつかの問題があります。私はjQueryのでは、これに対する解決策はそうのような「オン」機能を使用することです知っている:

$(document).on('click', '.song', function(){ 
    //code 
}); 

しかし、私は、これはCoffeeScriptのために変換する方法についてはわからないと思います。私はロケットの矢印 - > javascriptの無名関数に変換されている印象を受けていますが、その関数がパラメータの1つである場合、それはどのように機能しますか?私は非常にいくつかの構文を試してみましたが、どれもうまくいかないようです。ありがとう!

答えて

15
$(document).on('click', '.song', (-> 
    ### code ### 
)); 

はこのJavaScriptに変換します:あなたの代わりに->=>演算子を使用したい場合があり

$(document).on('click', '.song', (function() { 
    /* code */ 
})); 

注意を。二重矢印を使用すると、thisがイベントハンドラにバインドされます(jQueryのbindを使用するのと同じです)。

+0

@エペリですが、あなたの編集は私の好みではない可能性もあります。関数の内容に応じて、CSは終了を見つけるのに問題があります。これは、中カッコを明示的に配置することで解決されます。私はCSの曖昧さが気になることがわかります。 '$(document).on'はそれを呼び出すことなく' on'を返し、 'do $(document).on'はそれを呼び出し、' $(document).on something'もそれを呼び出し、 'do $(document) 。何かが結果を呼び出すでしょう。引数に明示的な中カッコを使用すると、このマスはエラーIMHOになりにくくなります。したがって私は戻って編集します。自由に投稿してください - 私はそれをupvoteします。 ;) – Lucero

+0

ロジャーと申し訳ありません。コード実行の順序が明確であれば、括弧でCSコードを見ることはめったにないので、明らかに編集したように見えます。この簡単な例のように。 – Epeli

+0

@エペリ、十分に公正な、それで私は自分自身を説明した。何千ものCSコードをモジュール式SPAで実行し、私の開発者が説明されている動作のいくつかに苦労しているのを見て、私は組織のメソッド呼び出しのために括弧を必要とすると決めました。同時に、 'do '。これは、特にコードのメンテナンス時に、コード品質を高く保つのに役立ちます。 – Lucero

4

JS2Coffeeが質問のこれらの種類を支援することができます:それは時々かなりトリッキーなJSコードにつまずくが、それは驚くほど正確だし、それが意志としてあなたは、js2coffeeと少し注意する必要があります

http://js2coffee.org/

通常は少なくともあなたをかなり近づけます。

21

通常、CoffeeScriptでは括弧を使用しません。だから、これは次のように書くことができます:

もちろん、実行順序が明白でないときは常に括弧を使用してください。

+0

これは** **答えです! – mlt

関連する問題