0

テキストフィールドの文字数を数えて数値を出力するjQuery関数を作成しています。しかし、キーリリースでは呼び出されないようです。テキスト フィールドのあるページは、外部ファイルに含まれている外部ページでありindex.phpjs外部jsファイルから含まれています。

  $('#commentField').keyup(function () {
    alert("functionCalled");
    var max = 500;
    var len = $(this).val().length;
    if (len >= max) {
      $('#charNum').html(' you have reached the limit');
    } else {
      var char = max - len;
      $('#charNum').text(char + ' characters left');
    }
  });

テキストエリア:

<input type="text" name="commentArea" placeholder="Comment..." autofocus="autofocus" id="commentField"/>

入力するdiv:

<div id="charNum">here</div>

外部jsファイルは正常にアクセスされていますが、関数が呼び出されていないようです。なぜこれが機能しないのですか?

4

3 に答える 3

4

動的コンテンツの場合は、.on を呼び出す必要があります。ただし、「body」を dom の要素に近いものに変更します。

$('body').on('keyup','#commentField',function () {
    alert("functionCalled");
    var max = 500;
    var len = $(this).val().length;
    if (len >= max) {
      $('#charNum').html(' you have reached the limit');
    } else {
      var char = max - len;
      $('#charNum').text(char + ' characters left');
    }
});
于 2013-04-05T17:46:42.267 に答える
2

charは JavaScript の予約語であるため、keyup 関数はコンパイルされません。別の名前を使用してみてください。

編集:

このフィドルで動作するようです。

于 2013-04-05T17:45:19.170 に答える
1

イベント ハンドラーはドキュメント準備完了関数内にありますか?

$(function () {

   //put your code here

});

次に、イベント バインド時に入力がページに存在するか? つまり、要素は動的に追加されますか? その場合は、イベント委任を試してください。

于 2013-04-05T17:43:45.533 に答える