Rails 3：无法让我的表单工作这个jQuery

Question

我发现了一个jQuery代码片段，用于在键入表单时对其进行倒计时。我试过将它添加到我的application.js文件中，但它不起作用。当我输入textarea时，数字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

裹你的文本ea binding in document.ready binding：

$(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(){ 

}); 

块内。