Question

我试图制作一个成功的角色计数器＆＃34;消息。

我的问题是指用户达到所需的字符数并且＆＃34;成功＆＃34;显示消息，如果他删除字符＆＃34;成功＆＃34;留言。

我认为它会计算每一个＆＃34; keyup＆＃34;但我想我错过了一些东西。非常感谢任何想法。

以下是代码：

＆＃13;

$('#count').text(10);
$('textarea').on('keyup', function() {
    if ($(this).val().length < 10) {
        $('#count').text(10 - $(this).val().length);
    } else {
      $('.enoughText').text('ok now.');
    }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea></textarea>

<p class="enoughText">you have more <span id="count"></span> to go.</p>

＆＃13;

Answer 1

问题是您使用类.enoughText更新整个段落。如果达到10，则将删除具有ID计数的跨度。

我的建议：

if ($(this).val().length < 10) {
  $('.enoughText').text('you have more ' + (10 - $(this).val().length) + ' to go.');
} else {
  $('.enoughText').text('ok now.');
}

Answer 2

Working Fiddle

问题在于，当您编写成功文本时，您覆盖了存储计数器的代码区域。

要解决此问题，您可以使用同一容器中的所有内容：

<强> HTML

<textarea></textarea>
<p class="response">you have more 10 to go.</p>

<强> JS

if($(this).val().length < 10) {
    $('.response').text("you have more " + parseInt(10 - $(this).val().length, 10) + " to go.");
}
else{
    $('.response').text('ok now.');
}

为什么jQuery .length没有更新？

2 个答案: