Letters count

by narensrinivasans

HTML

<textarea class="commentsArea" placeholder="Ask a comment, leave a question or introduce yourself" style="resize:none" maxlength="50"></textarea>
<p id="charNum"></p>

CSS

.commentsArea
{
    height:50px; width:250px; overflow:auto; resize:none; outline:none;
}

JavaScript

$('.commentsArea').keyup(function (e) {
	  var max = 50;
	  var len = $(this).val().length;
	  if (len >= max) {
		$('#charNum').text('0').css('color','red');
		e.preventDefault();
	  } else {
		var char = max - len;
		$('#charNum').text(char).css('color','black');
	  }
	}).change(function (e) {
	  var max = 50;
	  var len = $(this).val().length;
	  if (len >= max) {
		$('#charNum').text('0').css('color','red');
		e.preventDefault();
	  } else {
		var char = max - len;
		$('#charNum').text(char).css('color','black');
	  }
	});