如何使用 JQuery 计算 JavaScript 中的单词数答案

【问题标题】：How to count words in JavaScript using JQuery如何使用 JQuery 计算 JavaScript 中的单词数
【发布时间】：2012-02-03 21:19:18
【问题描述】：

我有一个简单的 html 文本框。当我“提交”文本框所在的表单时，我想使用 Jquery 获取一个包含 words 数量的变量。我还想检查输入的文本是否只有字母、数字和连字符（也在 jquery 中）。我不需要在用户输入时计算单词，只是在提交表单时。如果 jquery 被关闭，表单将不会提交，所以我猜不使用 php 没有安全风险。这是真的吗？

HTML：

<input type='text' name='name' id='name' />
<input type='button' value='Sign Up' id='signUp'>

JQUERY（尝试）：

var wordcount = $('#name').val()  // i don't know how to count the words

【问题讨论】：

将其命名为“如何使用 JQuery 在 JavaScript 中计算单词”会更好。
“如果 jquery 关闭，表单将不会提交，所以我猜不使用 php 没有安全风险。这是真的吗？” - 取决于你的意思通过“安全风险”：您必须在服务器端验证输入，因为恶意用户可以使用开发工具绕过您的客户端验证。客户端上的相同验证是改善用户体验的可选附加功能。顺便说一句，这并不是一个真正的 jQuery 东西，而是一个“普通”的 JavaScript 正则表达式和 .split() 的东西。
这是一个纯 JavaScript 中的Word and Character counter

标签： javascript jquery validation word-count

【解决方案1】：

var str = $('#name').val(),
    count = str.split(' ').length;

假设每个单词用空格隔开

【讨论】：

我很确定这只是给出了字符数。我正在尝试查找单词的数量
我误读了。 split 将字符串分隔成一个空格数组
val().length 返回一个数字，那边有错误。

【解决方案2】：

您将拆分字符串，然后计算结果数组的长度。

$('input[type="submit"]').click( function() {
    var words = $('#name').val().split(' ');
    alert(words.length);
});

【讨论】：

谢谢。有没有办法检查这些字符是否只是 jquery 中的字母数字和连字符？
是的，您可能希望为此使用正则表达式。您可以运行测试，如果它符合您的选择标准，结果将为真/假。正则表达式不是我的强项，所以你可能想问一个新问题。无论如何我都会尝试一下。
这不会很好用，因为您在单词之间放置的每个空格都将被视为另一个单词，因此“帮助我”将是 6 个单词！
这行得通，您可以添加额外的逻辑来处理任何其他字符串分隔符。

【解决方案3】：

您可以指定多个字符来拆分源字符串：

$('input[type="submit"]').click( function() {
    var words = $('#name').val().split(/[\s\.,;]+/);
    console.log(words.length);
});

【讨论】：

【解决方案4】：

从字符串 usign $.trim() 的开头和结尾删除空格非常有用。您可以使用keyup 事件进行实时计数。

$('#name').keyup(function(){
    var words = $.trim($(this).val()).split(' ');
    console.log(words.length);
});

【讨论】：

【解决方案5】：

其他答案略有改进，因为它处理更多边缘情况。即同时使用多个空格和标点符号，并正确处理文本开头和结尾的标点符号。

var numOfWords = $('#name').val().replace(/^[\s,.;]+/, "").replace(/[\s,.;]+$/, "").split(/[\s,.;]+/).length;

它首先去除文本开头和结尾的所有标点符号和空格，然后计算剩下的内容。显然，如果需要，可以添加更多标点符号（如感叹号）。

【讨论】：

【解决方案6】：

使用下面的正则表达式，我们可以删除任何类型的空格（单个或多个），以便计数非常准确。

$('#name').keyup(function(){
   var wordCount = $(this).val().split(/[\s\.\?]+/).length;
   console.log(wordCount);
});

查看我开发的这个 jQuery 插件：

https://github.com/mcdesignpro/maxLenght

【讨论】：

我已经为你更新了我的答案@Toby Speight :) 希望对你有帮助！
这是一个更好的答案，因为它可以处理额外的空白字符，例如双空格。如果您使用的是 textarea 等，它也超出了问题并处理换行。

【解决方案7】：

尝试使用 JQuery 计算 JavaScript 中的单词数。

$(document).ready(function(){
    $("button").click(function(){
        var words = $.trim($("#name").val()).split(" ");
        alert(words.length);
    });
});

【讨论】：

【解决方案8】：

您可以使用 JavaScript split() 方法计算字符串中的单词数。此方法只是通过指定字符（即空格“”）将字符串拆分为子字符串数组。然后显示'words'数组的长度。

$('input[type="button"]').click( function() {
    var words = $('#name').val().split(" ");
    alert(words.length);
});

这是一个例子：How to count words using JQuery

【讨论】：