Rails 3：このjqueryを自分のフォームで使用できない

Question

フォームに入力するときに文字をカウントダウンするためのコードのjqueryスニペットが見つかりました。私はapplication.jsファイルに追加しようとしましたが、動作しません。テキストエリアに入力すると、数字350は変わりません。

私は既にjquery-railsをインストールしていますが、私は<％= javascript_include_tag：all％>を使用しているので、問題ではありません。ここで私は私のapplication.js私が持っている私の見解で

$('textarea').keyup(function(){ 
    ta = $(this); 
    if(ta.val().length >= 350){ 
     ta.val(ta.val().substr(0, 350)); 
    } else { 
     $("#counter span").text(350-ta.val().length); 
    } 
}); 

setInterval('$("#counter span").text(350-ta.val().length);', 350); 

に持っているものです。

<%= form_for @post, :validate => true, :html => {:multipart => true} do |f| %> 
    <%= render 'shared/error_messages', :object => f.object %> 
    <div class="field"> 
     <%= f.label :title, 'Title:' %><br /> 
    <%= f.text_field :title %><br /> 
    <%= f.label :image, "Choose image"%><br /> 
    <%= image_tag(@post.image_url(:avatartiny).to_s) if @post.image? %> 
    <%= f.file_field :image %> 
    <%= f.hidden_field :image_cache %><br /> 
    <%= f.label :content %><br /> 
    <%= f.text_area :content %><br /> 
    <div id="counter"><span>350</span> characters remaining.</div> 
    </div> 
    <div class="actions"> 
    <%= f.submit "Submit" %> 
    </div> 
<% end %> 

そして、私のcustom.cssで私が持っている：ここでは

textarea { 
    width:400px; 
    height:400px; 
    border:1px solid #999; 
    border-radius:3px; 
    padding:7px; 
} 

#counter span { font-weight:700 } 

は何私のhtmlです情報源：

<form accept-charset="UTF-8" action="/posts" class="new_post" data-validate="true" 
enctype="multipart/form-data" id="new_post" method="post" novalidate="novalidate"><div 
style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /><input 
name="authenticity_token" type="hidden" value="V6J0VERvuoKvQ5kXXgBuU5aC6VsKQ7W6RF30IKy9D7E="/></div> 

<div class="field"> 
     <label for="post_title">Title:</label><br /> 
<input data-validate="true" id="post_title" name="post[title]" size="30" type="text" /><br /> 
<label for="post_image">Choose image</label><br /> 

<input data-validate="true" id="post_image" name="post[image]" type="file" /> 
<input id="post_image_cache" name="post[image_cache]" type="hidden" /><br /> 
<label for="post_content">Content</label><br /> 
<textarea cols="40" id="post_content" name="post[content]" rows="20"></textarea><br /> 
<div id="counter"><span>350</span> characters remaining.</div> 
</div> 

Answer 1

テクスチャをラップするドキュメントバインドのバインディング：

$(function() { 
    $('textarea').keyup(function(){ 
     ta = $(this); 
     if(ta.val().length >= 350){ 
      ta.val(ta.val().substr(0, 350)); 
     } else { 
      $("#counter span").text(350-ta.val().length); 
     } 
    }); 
}); 

これは機能しますか？

Answer 2

your javascriptには何の問題もので、多分

$(document).ready(function(){ 

}); 

ブロック内にコードを入れてみてくださいありません。