javascript - 字符限制显示 "negative"数字中的剩余字符

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”。这是你的提示吗？发生这种情况的原因是因为您将编辑器的文本内容 trim 到 maxCount，但是您的剩余字符值是在 trim 发生之前计算的，因此它仍然具有 maxCount 的值 - 未 trim 的长度。您可以通过多种方式轻松解决此问题，包括更改此内容:

$(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;

如果您只想 trim 末端的空白字符，请使用以下命令:

var txtLen = txt.trim().length;