总额

Question

我试图来算的话，在每一个textarea的用户类型，并把它们加起来，并显示给用户，因为他们键入我有这个迄今为止量：

$("[class^='count[']").bind('keyup click blur focus change paste', function() { 

    sum = 0; 

     $("[class^='count[']").each(function() { 

      var Words = jQuery.trim($(this).val()).split(' ').length; 

      sum += Number(Words); 

      if($(this).val() === '') { sum = 0; } 

      $('#maxwords').children('span').text(sum); 



     }); 



}); 

，这里是我的HTML：

<ul id="forms"> 

      <li><textarea name="PresentationAbstract1" id="PresentationAbstract1"style="width:700px"></textarea></li> 

      <li><textarea name="PresentationAbstract2" id="PresentationAbstract2"style="width:700px"></textarea></li> 

      <li><textarea name="PresentationAbstract3" id="PresentationAbstract3"style="width:700px"></textarea></li> 


      <li id="maxwords">Total words (<span>0</span>)</li> 
     </ul> 

然而，问题是，这个代码不输出任何东西，直到你到达最后一个textarea的，在这种情况下是第三之一，只要你点击最后一个textarea会计算单词的数量并输出它。

以下是所需项目的URL： http://www.meetingproceedings.com/harvester2/wordcount.html。 任何想法，将不胜感激。

Answer 1

您可以通过代码改进几件事情，但最突出的是$('#maxwords').children('span').text(sum);在您的.each()迭代中。每次计算textarea中的单词数时，这将使您的代码编写您的字数。然后是if($(this).val() === '') { sum = 0; }行，如果文本区域内没有任何内容，则重置单词计数（这就是为什么当在第三个文本区域上书写时该单词只计数“输出”到跨度的原因）。

试试这个代码，而不是：

$(function() { 

    var countWords = function() { 
     var sum = 0; 
     $("textarea").each(function() { 

      var words = $(this).val().split(' '); 
      $.each(words, function(i, v) { 
       if ($.trim(v) !== '') {sum++;} 
      }); 

     }); 

     $('#maxwords span').text(sum); 
    }; 

    // this binds our counting function to the textareas 
    $("textarea").bind('keyup click blur focus change paste', countWords); 

    // let's run this on document ready 
    countWords(); 

}); 

这是一个O(n^2)算法，但它正确检查重复空格（或者说一个O(nm)？）。尝试与正则表达式匹配来降低复杂度可能会更好。

这是working on my jsFiddle here。

编辑

更新解决还运行在文件准备计数功能。或者，您还可以将ready处理程序添加到textarea绑定（即$("textarea").bind('ready keyup click blur focus change paste', countWords)），而不是调用函数本身，并且该处理程序也应该启动到文档就绪处理程序，但我更愿意将其写出来以便清楚。

Answer 2

为什么你有这条线？尝试删除它。

if($(this).val() === '') { sum = 0; } 

它导致你的总和，如果你遇到一个空场，你总是会，直到填充后场各个领域有内容复位至零。

Answer 3

$("#form textarea").live('KeyUp', function(){ 
var sum = 0; 
$("#form textarea").each(function(){ 
    sum+= $(this).val().split(' ').length; 

}); 
//put sum in your span 
}); 

如果你希望它是真正的你需要在keyup事件上工作。