Counting and limiting words in a textarea

Using return false to stop keyup events doesn't block the event, because in this case the event has already fired. The keyup event fires when the user releases a key, after the default action of that key has been performed.

You will need to programmatically edit the value of the textarea you have as #wordcount:

$(document).ready(function() {
  $("#word_count").on('keyup', function() {
    var words = 0;

    if ((this.value.match(/\S+/g)) != null) {
      words = this.value.match(/\S+/g).length;
    }

    if (words > 200) {
      // Split the string on first 200 words and rejoin on spaces
      var trimmed = $(this).val().split(/\s+/, 200).join(" ");
      // Add a space at the end to make sure more typing creates new words
      $(this).val(trimmed + " ");
    }
    else {
      $('#display_count').text(words);
      $('#word_left').text(200-words);
    }
  });
});

http://jsfiddle.net/k8y50bgd/


Adding a simple if condition will solve your problem.

$.each(wordCounts, function(k, v) {
    if(finalCount <= 200) {
        //Todos
    }
    else {
      return false;  //prevent keyup event
    }
 });

A simple plugin can be found here:

Simple Textarea Word Counter using jQuery


I would do it like this ?

$("#word_count").on('keydown', function(e) {
    var words = $.trim(this.value).length ? this.value.match(/\S+/g).length : 0;
    if (words <= 200) {
        $('#display_count').text(words);
        $('#word_left').text(200-words)
    }else{
        if (e.which !== 8) e.preventDefault();
    }
});

FIDDLE