JQuery打字限制器

时间:2013-02-06 15:41:31

标签: jquery textarea keyup

好的第一次来这里,我已经有问题了。 我需要创建输入限制器..所以当达到0时,用户不能再输入..

$('#text_area').keyup(function() {
    var max_length = 55;
    var area_length = $(this).val().length;
    var remaining_text = max_length - area_length;

    $('#area_feedback').html(remaining_text + ' characters left');
    if (remaining_text <= 0) {
        $(this).css('color','red');
        //what goes here ?

    } else {
        $(this).css('color','black');
    }
});

3 个答案:

答案 0 :(得分:1)

尝试使用keypress事件处理程序。

像这样:Live Demo

$('#text_area').keypress(function(e){
    var max_length = 55;
    var area_length = $(this).val().length;
    var remaining_text = max_length - area_length;
    $('#area_feedback').html(remaining_text + ' characters left');

    if(remaining_text <= 0){
        $(this).css('color','red');

        e.preventDefault();
        return false;
    }
    else{
        $(this).css('color','black');
    }
}); 

答案 1 :(得分:0)

也许这个jquery插件可以帮助你

http://www.stjerneman.com/demo/maxlength-with-jquery

答案 2 :(得分:0)

您应该尝试一下:使用KeyPress事件并设置文本区域的maxLength,如下所述..

$('#text_area').keypress(function(){
   var max_length = 55;

   $('#text_area').attr('maxlength',max_length); //sets the max length of textbox to 55

   var area_length = $(this).val().length;
   var remaining_text = max_length - area_length;
   $('#area_feedback').html(remaining_text + ' characters left');
   if(remaining_text <= 0){
      $(this).css('color','red');          
   }
   else{
      $(this).css('color','black');
   }
});