为什么我的单词计数器不返回任何内容？

Question

我制作了一个简单的单词计数器来计算 HTML 文本框中的单词数。它从 html 文档中的 inputText 字段获取数据，并计算其中有多少个实际单词。我无法让它在框中显示字数。我做错了什么？

function count_words(evt) {
    var input = document.getElementById('inputText').value;
    var words = 0;
    input = count_words().replace(/(< ([^>]+)<)/g, '').replace(/\s+/g, ' ');
    input = input.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
    words = input.split(' ').length;

    words = document.getElementById('numberOfWords').innerHTML;
}

window.onload = function (evt) {
    if (document && document.getElementById) {
        document.getElementById('btnConvert').onclick = count_words;
    }
}

<textarea id="inputText" cols="30" rows="6">The quick brown fox jumps over the lazy dog.</textarea>
<br>
<input type="button" id="btnConvert" value="Word Count">
<input id="numberOfWords" type="text" value="" size="6">

Answer 1

只需对您的函数进行少量编辑即可解决问题

  function count_words(evt) {
    var input = document.getElementById('inputText').value;
    var words = 0;
    input = input.replace(/(< ([^>]+)<)/g, '').replace(/\s+/g, ' ');
    words = input.split(' ').length;
    document.getElementById('numberOfWords').value = words; 
}

Answer 2

words = document.getElementById('numberOfWords').innerHTML;

这部分是错误的。这意味着您正在将 innerHTML 属性值分配给 words 值。

现在，您正在向 input 标签插入值，因此您需要将 words 值分配给 value 属性。

document.getElementById('numberOfWords').value = words;

input = count_words().replace(/(< ([^>]+)<)/g, '').replace(/\s+/g, ' ');

这部分是错误的。 count_words() 应替换为 input。

function count_words(evt) {
    var input = document.getElementById('inputText').value;
    var words = 0;
    input = input.replace(/(< ([^>]+)<)/g, '').replace(/\s+/g, ' ');
    input = input.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
    words = input.split(' ').length;

    document.getElementById('numberOfWords').value = words;
}

window.onload = function (evt) {
    if (document && document.getElementById) {
        document.getElementById('btnConvert').onclick = count_words;
    }
}

<textarea id="inputText" cols="30" rows="6">The quick brown fox jumps over the lazy dog.</textarea>
<br>
<input type="button" id="btnConvert" value="Word Count">
<input id="numberOfWords" type="text" value="" size="6">

Answer 3

我知道了，只需将 count_words().replace 更改为 input.replace 并将 words = document.getElementById('numberOfWords').innerHTML 更改为 document.getElementById('numberOfWords').innerText = words

function count_words(evt) {
    var input = document.getElementById('inputText').value;
    var words = 0;
    input = input.replace(/(< ([^>]+)<)/g, '').replace(/\s+/g, ' ');
    input = input.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
    words = input.split(' ').length;

    document.getElementById('numberOfWords').value = words;
}

window.onload = function (evt) {
    if (document && document.getElementById) {
        document.getElementById('btnConvert').onclick = count_words;
    }
}

为什么我的单词计数器不返回任何内容？

Why is my word counter not returning anything?

html

javascript

word-count