Javascript 字符计数器重复

Question

我正在尝试复制以下代码，但无论我尝试何种组合，我都无法使它的第二个副本正常工作。基本上我有两个 html textarea 框，我需要在同一页面上计算字符数。如果它更容易的话，它们实际上可以有相同的精确计数，我不只是确定如何复制 JS 并仍然具有它的功能。

function countChars(countfrom,displayto) {
  var len = document.getElementById(countfrom).value.length;
  document.getElementById(displayto).innerHTML = len;
}

<textarea id="data"
 onkeyup="countChars('data','charcount');" 
onkeydown="countChars('data','charcount');" 
onmouseout="countChars('data','charcount');"></textarea>
<span id="charcount">0</span> characters entered.

Answer 1

您必须使用其他 id 和 span 创建新的文本区域以显示字符数，也必须使用其他 id。然后你使用相同的函数来计算字符，但使用其他 id

function countChars(countfrom,displayto) {
  var len = document.getElementById(countfrom).value.length;
  document.getElementById(displayto).innerHTML = len;
}

<textarea id="data" onkeyup="countChars('data','charcount');" onkeydown="countChars('data','charcount');" onmouseout="countChars('data','charcount');"></textarea>

<span id="charcount">0</span> characters entered.

<textarea id="data2" onkeyup="countChars('data2','charcount2');" onkeydown="countChars('data2','charcount2');" onmouseout="countChars('data2','charcount2');"></textarea>

<span id="charcount2">0</span> characters entered.