如何使用 jQuery 对多个文本区域进行字数统计？

Question

我已经使用以下 JS 成功地对文本区域进行了字数统计：

   jQuery('span.after-amount').append(' - You have <span class="wordcount">0</span> words.'); 

   jQuery('textarea').on('input', function($) {

      var regex = /\s+/gi;
      var count =  jQuery(this).val().trim().replace(regex, ' ').split(" ").length;

      $('.wordcount').html(count);


    });

我的HTML:

<textarea class="tmcp-field tmcp-textarea" name="tmcp_textarea_2"></textarea>
<span class="after-amount">You have <span class="wordcount">0</span> words.</span>

<textarea class="tmcp-field tmcp-textarea" name="tmcp_textarea_2"></textarea>
<span class="after-amount">You have <span class="wordcount">0</span> words.</span>

<textarea class="tmcp-field tmcp-textarea" name="tmcp_textarea_2"></textarea>
<span class="after-amount">You have <span class="wordcount">0</span> words.</span>

这里是Fiddle.

我需要计算每个文本区域的字数，有没有无需单独选择每个文本区域的简单方法？

Answer 1

这是我的解决方案，首先我将您的事件处理程序更改为 keyup，并使用 $(this) 开始计算每个文本区域值的长度，以便您获得当前文本区域。

$(function(){
   $('textarea').on('keyup', function(){
      var wordsLength = $(this).val().length;
      $(this).next().find('.wordcount').html(wordsLength);
   });
});

检查此 updated jsfiddle。希望这有帮助

Answer 2

刚刚找到 .wordcount 进入 <li>

jQuery('textarea').on('input', function($) {
        var regex = /\s+/gi;
        var count =  jQuery(this).val().trim().replace(regex, ' ').split(" ").length;
        jQuery(this).parent().find('.wordcount').html(count);
);

如何使用 jQuery 对多个文本区域进行字数统计？

How to do a Word Count on Multiple Textareas using jQuery?

html

javascript

jquery

word-count