时间戳

首页 > 解决方案 > 带有字符计数器的自定义消息框不起作用

javascript - 带有字符计数器的自定义消息框不起作用

问题描述

我有这个自定义代码将计数设置为字符数，但是相反，它将计数设置为这个 ${textLength}

const textarea = document.querySelector('textarea');
const count = document.querySelector('.count');

function countLetters() {
  const text = textarea.value;
  const textLength = textarea.value.length;
  count.innerText = '${textLength}';
}
<div class="MessageBox">
  <h3>Message</h3>
  <textarea placeholder="Message" onkeyup="countLetters()"></textarea>
  <p>Total Characters : <span class="count">0</span></p>
</div>

标签： javascripthtml

解决方案

您在 textLength 变量中有值。直接用就行了。

const textarea = document.querySelector('textarea');
const count = document.querySelector('.count');

function countLetters() {
  const text = textarea.value;
  const textLength = textarea.value.length;
  count.innerText = textLength;
}
<div class="MessageBox">
  <h3>Message</h3>
  <textarea placeholder="Message" onkeyup="countLetters()"></textarea>
  <p>Total Characters : <span class="count">0</span></p>
</div>

推荐阅读