jQueryの：JavaScriptエラー「エラー：定義されていませんtaの」

Question

を私はjQueryのに新たなんだと、私はこのコードを使用してテキストフィールドに文字カウンターを追加しようとしていた：（レールコード付き）

$(function(){ 
    $('.content').keypress(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); 

HTML

"Error: ta is not defined" 

と私のコードでは、この特定の行に私を指す：

<div> 
<%= f.label :content, "Content" %><br /> 
<%= f.text_area :content, :class => "content" %><br /> 
<div id="counter"><span>350</span> characters remaining.</div> 
</div> 

私は、JavaScriptのエラーを取得しておきます。

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

起こっていただきましたし、どのように私は別の場所にウェブサイトに他のテキストフィールドのための複数のカウンタを追加したいと、それは本当にいただければ幸い修正するに任意の洞察力。

ありがとうございました。

Answer 1

最初のキーを押すまでは定義されません。その前に、間隔が間違ってしまう。また、setInterval行を$（）関数に。あなたのkeypressイベント機能は、カウントダウンであなたが望むすべての機能を行うように見えるときにするsetIntervalを持っている理由のキープレス

$(function(){ 
    ta = $(".content"); 

    $('.content').keypress(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); 
}); 

はしかし、私はわかりません。

Answer 2

あなたは

変更このtaを定義していないので、あなたがそのエラーを取得している理由は次のとおりです。これに

ta = $(this); 

：

var ta = $(this); 

また、あなたが望むコードを渡します次のような無名関数でsetIntervalに渡されます：

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

しかし、もう1つの問題があります。 setIntervalが呼び出す無名関数のスコープにはtaが含まれないため、ta.val().lengthを参照することはできません。書類の外側にtaを宣言し、すでに行っているように変数を内側に設定して、変数のスコープを正しく設定する必要があります。

EDIT：

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

setInterval(function() 
{ 
    $("#counter span").text(350 - taLength); 
}, 350); 

Answer 3

おそらくあなたは間違った方法で自分のキャラクターのカウンターを作っている：

あなたは、あなたがすべき、フィールド内の文字をカウントするすべての時間を実行しているsetInterval機能を任せることはできません

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

     $("#counter span").text(350 - ta.val().length); 
    }); 
}); 

Answer 4

taはkeypress（）内のanon関数まで定義されていないため、その関数の外では使用できません。

あなたがそうのようなコードを再記述することができます。

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

は、私はあなたがたsetIntervalの使用を削除し、代わりに、単にそれぞれのキー押下後の文字カウントを更新することをお勧めします。ただし、テキストを貼り付けるなどの他のケースを考慮する必要があります。