字符限制以“负”数字显示剩余字符

Question

我使用的是 tinyMCE 版本 3，我使用的是富文本编辑器，它在输入时计算剩余的字符。由于 maxLength 属性不适用于 tinyMCE3。我已经以这种方式进行了硬编码，但它也计算了空白字符

< script type = "text/javascript" >

  tinyMCE.init({
    mode: "textareas",
    theme: "advanced",
    editor_selector: "mceEditor",
    theme_advanced_statusbar_location: "bottom",
    theme_advanced_path: false,
    statusbar: true,
    setup: function(editor) {
      editor.onKeyUp.add(function(c) {
        //    var maxCount = document.getElementById(editor.id).maxLength;
        var maxCount = 10;
        console.log(editor.id);
        var txt = $(editor.getBody()).text();
        var txtLen = txt.length;
        var value = maxCount - (txtLen);
        $(tinyMCE.activeEditor.getContainer()).find("#" + editor.id + "_path_row").html("Remaining chars: " + (value));

        if (txtLen > maxCount) {
          editor.setContent("");
          tinyMCE.activeEditor.selection.setContent(txt.substring(0, maxCount));
          tinyMCE.activeEditor.focus();
        }
      });
    }

  }); <
/script>

<textarea id="1" class="mceEditor" cols="100" rows="7" wrap="" maxlength="10">test sample</textarea>

Counting in negative

Counting in negative numbers and setting content to blank

当我在中间输入 2 个字符时，它会删除最后两个字符，有什么方法可以在达到计数器“0”后停止输入。

Answer 1

我不确定我是否完全理解您的问题，因为这里发生了很多事情。

将剩余字符显示为负数

我看到，使用您的代码，如果您输入 11 个字符，则第 11 个字符将被删除，但剩余的字符显示“-1”而不是“0”。这是你的抱怨吗？发生这种情况的原因是因为您将编辑器的文本内容修剪到 maxCount，但您的剩余字符值是在修剪发生之前计算的，因此它仍然具有 maxCount 的值 - 未修剪长度。您可以通过多种方式轻松解决此问题，包括更改此问题：

$(tinyMCE.activeEditor.getContainer()).find("#" + editor.id + "_path_row").html("Remaining chars: " + (value));

到这里：

$(tinyMCE.activeEditor.getContainer()).find("#" + editor.id + "_path_row").html("Remaining chars: " + (value > 0 ? value : 0));

计算空白字符

如果您不希望计数中包含 任何 个空白字符，请使用：

var txtLen = txt.replace(/\s/g,"").length;

如果您只想修剪结尾的空白字符，请使用：

var txtLen = txt.trim().length;