textarea输入限制+字数统计(JQuery版)，练习JQuery

 

$(function(){ 
 jQuery.fn.extend({ 
        showWordCount: function() { 
            var _max = $(this).attr('max');
   var _length = $(this).text().length;
   if(_length > _max) {
    $(this).text($(this).text().substring(0, _max));
   }
   _left = $(this).offset().left;
   _top = $(this).offset().top;
   _width = $(this).width();
   _height = $(this).height();
   $('#div_1').html(_length + '/' + _max);
   $('#div_1').css({
    'left':_left + _width - 105,
    'top':_top + _height - 16
   });
        } 
    });
 
 $('textarea').bind('propertychange', function() {
  $(this).showWordCount();
 });
 
 $('textarea').focus(function(){ 
  $(this).showWordCount();
     $('#div_1').fadeIn('slow');
 });
 
 $('textarea').blur(function(){
        $('#div_1').fadeOut('slow');
 });
});

 

【效果演示】

123