Количество слов отображать текст, если количество превышает / меньше 500 слов - PullRequest
Новая
       12

Количество слов отображать текст, если количество превышает / меньше 500 слов

0 голосов
/ 27 марта 2019

Я пытаюсь подсчитать количество слов, введенных в поле textarea.Я хотел бы отобразить текст «Ваш текст меньше 500 слов, пожалуйста, напишите еще», если количество слов меньше 500 слов и если количество слов превышает 500, то должно быть написано «Отличная работа! Ваш текст содержит более 500 слов».Как мне этого добиться? 

$(document).ready(function()
{
    var wordCounts = {};
    $("#my_word_count").keyup(function() {
        var matches = this.value.match(/\b/g);
        wordCounts[this.id] = matches ? matches.length / 2 : 0;
        var finalCount = 0;
        $.each(wordCounts, function(k, v) {
            finalCount += v;
        });
        $('#display_word_count').html(finalCount);
        am_cal(finalCount);
    }).keyup();
 }); 

<textarea name="txtScript" id="my_word_count" cols="100" rows="10"></textarea>
<br>Total word Count : <span id="display_word_count">0</span> words.

Фрагмент кода

1 Ответ

0 голосов
/ 27 марта 2019

Вместо подсчета границ слов я бы посоветовал подсчитать фактические слова. 

$(document).ready(function() {
  var $wordCountDisplay = $('#display_word_count');
  var $wordCountDisplayMessage = $('#display_word_count_message');
  var desiredMinimumWordCount = 10;
  
  $('#my_word_count').on('input', function (e) {
    var wordCount = ( e.target.value.match(/\w+/g) || [] ).length;
    $wordCountDisplay.text(wordCount);
    
    if (wordCount < desiredMinimumWordCount) {
      $wordCountDisplayMessage.text('Your text is below '+ desiredMinimumWordCount +' words please write some more');
      $wordCountDisplayMessage.removeClass('greatJob');
    } else {
      $wordCountDisplayMessage.text('Great job! Your text is over '+ desiredMinimumWordCount +' words');
      $wordCountDisplayMessage.addClass('greatJob');
    }
  }).trigger('input');
});
.greatJob { color: blue; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea name="txtScript" id="my_word_count" cols="100" rows="10"></textarea>
<br>Total word Count : <span id="display_word_count">0</span> words.
<br><span id="display_word_count_message"></span>
...