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

时间:2019-05-06 17:31:09

标签: javascript jquery html string tinymce-3

我正在使用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”后停止提供输入。

1 个答案:

答案 0 :(得分:2)

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

将其余字符显示为负数

我看到,使用您的代码,如果您键入11个字符,第11个字符将被删除,但是其余字符显示为“ -1”而不是“ 0”。这是您的投诉吗?发生这种情况的原因是因为您将编辑器的文本内容修整为maxCount,但是您的剩余chars值是在修整发生之前计算的,因此它仍然具有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;