javascript - jquery字符超过字符，显示正值呢？

Question

目前此函数中发生的情况是，当字符超过 2000 个时，它开始显示 -x 剩余字符数，即剩余 -1 个字符。我希望它是这样的，即当字符超过 2000 个时，我希望它显示超过限制的 1 个字符等...

$(document).ready(function() {
  var text_max = 2000;
  $('#textarea_feedback').html(text_max + ' character available.');

  $('#YourMessage').keyup(function() {
    var text_length = $('#YourMessage').val().length;
    var text_remaining = text_max - text_length;

    $('#textarea_feedback').html(text_remaining + ' characters remaining.');
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<textarea id="YourMessage"></textarea><br/> <span id="textarea_feedback"></span>

Answer 1

这里有一个版本，它将获得剩余的绝对值。 如果剩余的值高于 0，则显示一个文本，低于另一个文本

$(document).ready(function() {
  var text_max = 20;
  $('#textarea_feedback').html(text_max + ' characters available.');

  $('#YourMessage').keyup(function() {
    var text_length = $('#YourMessage').val().length;
    var text_remaining = text_max - text_length;
    var characters = " character"+(Math.abs(text_remaining)==1?"":"s");
    $('#textarea_feedback').html(Math.abs(text_remaining) + characters + (text_remaining > 0? ' remaining.':' over the limit.'));
    $('#textarea_feedback').toggleClass("red",text_remaining<0).toggleClass("green",text_remaining>=0)
  });
});

.red { color:red; }
.green { color:green; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<textarea id="YourMessage"></textarea><br/> <span class="green" id="textarea_feedback"></span>