javascript - RailsでJqueryとCoffeescriptを使用して要素を非表示にする方法は?

Question

Rails サイトのページ内の要素を非表示にしたいのですが、Jquery や Coffeescript にはまだ慣れていません。

このコードはコンソールで機能します。

$('#TheButton').click(function(){$('#TheText').toggle()});

次に、それを Coffescriptに変換しました。

$("#TheButton").click ->
  $("#TheText").toggle()

しかし、Rails ページでは機能しません。どうすれば修正できますか？以下は、生成された JavaScript ファイルです。

(function() {
jQuery(function() { 
# stuff... 
  });

  $('form').on('click', '.add_fields', function(event) {
  # stuff... 
  });

  $("#TheButton").click(function() {
    return $("#TheText").toggle();
  });

}).call(this);

Answer 1

JS ファイルがレイアウトの上部に埋め込まれている場合、すべてのファイルをその jQuery 呼び出しでラップする必要があります。

Answer 2

jQuery のセレクターは、ページが読み込まれるまで機能しません。ドキュメントの準備ができたら、コードが実行されることを確認する必要があります。

$(document).ready ->

  $("#TheButton").click ->
    $("#TheText").toggle()

  # other stuff you want to happen after document load

Answer 3

追加

$ ->

DOM がロードされた後にコードが確実に実行されるようにするためのコードの前。