限制tinyMCE中的字符数

2024-01-06

我在用着tinyMCe对于我的项目。一切正常,但现在我想限制插入的字符数tinyMce文本区域

tinyMCE.init({
// General options
mode : "textareas",
theme : "simple",
plugins : "autolink,lists,pagebreak,style,table,save,advhr,advimage,advlink,emotions,media,noneditable,nonbreaking",

// Theme options
theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,fontselect,fontsizeselect",
theme_advanced_buttons2 : "bullist,numlist,|,outdent,indent,|,undo,redo,|,link,unlink,anchor,image,code,|,forecolor,backcolor",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
max_chars : "10",
max_chars_indicator : "lengthBox",
theme_advanced_resizing : true
});

我用了 :-

max_chars : "10",
max_chars_indicator : "lengthBox",

但仍然无法正常工作。提前致谢。


这适用于tinyMCE 4.3.12,并且还捕获粘贴:

编辑:修复了错误和扩展代码以在编辑器下显示字符计数器。可能不是最好的方法,因为它有点依赖于 tinyMCE 当前的 HTML 结构,编辑器 div 在隐藏文本区域之前。

该版本只计算文本长度,忽略HTML标签长度。要计算完整的 HTML 长度,请将所有“innerText”替换为“innerHTML”。

tinymce.init({
    max_chars: 1000, // max. allowed chars
    setup: function (ed) {
        var allowedKeys = [8, 37, 38, 39, 40, 46]; // backspace, delete and cursor keys
        ed.on('keydown', function (e) {
            if (allowedKeys.indexOf(e.keyCode) != -1) return true;
            if (tinymce_getContentLength() + 1 > this.settings.max_chars) {
                e.preventDefault();
                e.stopPropagation();
                return false;
            }
            return true;
        });
        ed.on('keyup', function (e) {
            tinymce_updateCharCounter(this, tinymce_getContentLength());
        });
    },
    init_instance_callback: function () { // initialize counter div
        $('#' + this.id).prev().append('<div class="char_count" style="text-align:right"></div>');
        tinymce_updateCharCounter(this, tinymce_getContentLength());
    },
    paste_preprocess: function (plugin, args) {
        var editor = tinymce.get(tinymce.activeEditor.id);
        var len = editor.contentDocument.body.innerText.length;
        var text = $(args.content).text();
        if (len + text.length > editor.settings.max_chars) {
            alert('Pasting this exceeds the maximum allowed number of ' + editor.settings.max_chars + ' characters.');
            args.content = '';
        } else {
            tinymce_updateCharCounter(editor, len + text.length);
        }
    }
});

function tinymce_updateCharCounter(el, len) {
    $('#' + el.id).prev().find('.char_count').text(len + '/' + el.settings.max_chars);
}

function tinymce_getContentLength() {
    return tinymce.get(tinymce.activeEditor.id).contentDocument.body.innerText.length;
}

参考:如何防止tinyMCE粘贴事件? https://stackoverflow.com/questions/15016210/how-can-i-prevent-tinymces-paste-event

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

限制tinyMCE中的字符数 的相关文章

  • JavaScript 对输入的循环创建一个对象数组

    我正在尝试循环 div 中的输入元素 以创建对象数组 div div
  • 我们在哪里/什么时候使用 JSON?

    你能告诉我 JSON 有什么用 在 Javascript 和 PHP 中 当我们需要 JSON 方法时 我从以下链接中阅读 但是 我没有获得有关任何项目的 JSON 实现的任何信息 http www json org js html htt
  • AngularJS 和 Apiary.IO - 无法读取任何响应标头?

    我使用 Apiary io 模拟我的 API 但不知怎的 我无法使用 angularJS 从响应对象中读取任何标头 我确信我至少通过检查 firebug 正确设置了 Content Type application json Angular
  • Puppeteer 的行为与开发者控制台不同

    我正在尝试使用 Puppeteer 提取此页面的标题 https www nordstrom com s zella high waist studio pocket 7 8 leggings 5460106 https www nords
  • Google javascript 登录 api:无法离线访问

    我正在尝试为服务器端应用程序实现 Google 登录 如 Google 文档中所示 服务器端应用程序的 Google 登录 https developers google com identity sign in web server si
  • webrtc - 获取网络摄像头的宽高比

    我正在尝试学习如何开发 webRTC 应用程序 我想知道是否可以获得相机的宽高比 我不知道它是否有帮助 但我正在使用 webrtc io 但是 if更好 我可以停止使用它 From MDN https developer mozilla o
  • 无法使用 MV3 从 Firefox 下的通用脚本导出到 background.js

    我试图在服务工作者 background js 和内容脚本之间重用一些功能 https stackoverflow com questions 73421706 how to reuse a javascript function betw
  • 传单圆圈绘制/编辑问题

    我第一次制作传单 并面临绘制圆圈和编辑 更改圆圈位置 的问题 我面临的问题是 编辑 移动 圆从一个位置到另一位置会改变其半径 Note 请尝试在给定的小提琴中在地图顶部创建圆圈 然后通过单击编辑按钮将其移动到底部 如果我在地图的顶部创建圆圈
  • 如何在 Angular2 中为表单分配和验证数组

    我的模型 this profile 在 javascript 中有一个属性叫做emails 这是一个数组 email isDefault status 然后我将其定义如下 this profileForm this formBuilder
  • Java:从 ScriptEngine javascript 返回一个对象

    我正在尝试使用 Java 来评估 javascript脚本引擎 https docs oracle com javase 7 docs api javax script ScriptEngine html班级 这是我正在尝试做的事情的一个简
  • AngularJS:ng-show 与 display:none

    我有一个用例 我必须使用 CSS 默认隐藏 HTML 元素 如下所示 HTML div class item div CSS item display none 但是 我需要在页面加载后使用 ng show 切换元素的可见性 如下所示 di
  • 有效地获取下拉列表中的选定选项(XHTML Select 元素)

    背景 使用 XHTML Select 元素的下拉列表中有大量选项 数十个 我需要使用 JavaScript 检索所选选项 Problem 目前我正在使用 jQuery selectedCSS 选择器并且它按预期工作 但这种方法效率不高 因为
  • 可点击的进度条

    我正在使用 Angular 并在 JavaScript 的帮助下开发了一个可点击的进度条 这是我能做到的最好的 有没有办法将滑块放置在进度条内但不干扰进度可视化 堆栈闪电战 https stackblitz com edit angular
  • jQuery 和所有 .js 文件无法在本地运行,只能在外部运行

    我有一个奇怪的问题 我正在编写一个网站 包括 jQuery 和一些插件 它们存储在 js 文件夹中 当我尝试通过浏览器 jQuery 打开它时 插件和所有自定义脚本都不起作用 也许这与我的代码有关 但不这么认为 当然 当我在外部包含 jQu
  • 输入和文本区域可以拖动吗?

    MDN 规范以及我能通过 Google 找到的每个网站都说所有 HTML 元素都可以拖动 然而 在实践中 我发现我无法拖动文本输入或文本区域 即使它们已被禁用 例如 使用以下代码 img src http www placehold it
  • jqPlot DateAxis tickInterval 不起作用

    我试图每月绘制一个包含单个数据点的图表 我会在每个月的第一天将其作为一个点发送到 jqPlot jqplot actualChart 2011 10 01 0 296 2011 11 01 0 682 title programSelect
  • Array.indexOf 如何比 Array.some 更高效

    这个问题的灵感来自于这个问题的竞争答案 具有多个参数的indexOf https stackoverflow com questions 39000151 indexof with multiple arguments 用户想知道一种有效的
  • 关于 Node.js Promise then 和 return?

    我对承诺感到困惑 I use 那么就答应没有返回像这样 new Promise resolve reject gt resolve 1 then v1 gt console log v1 new Promise resolve reject
  • 当 mp4 是唯一来源时,自定义 HTML5 视频控件不起作用

    问题 我只有一个视频源 mp4 因为我正在尝试向 tumblr 视频添加自定义控件 如果只有mp4作为源video duration返回为NaN 作为使用 3 个源 mp4 webm ogg 时的测试 它可以工作 所以video durat
  • nodeJS exec 不适用于“cd”shell cmd

    var sys require sys exec require child process exec exec cd home ubuntu distro function err stdout stderr console log cd

随机推荐

  • 使用 GDB 调试模板

    My gdb是 GNU gdb Red Hat Linux 6 3 0 0 1 162 el4rh 我无法调试模板 如何使用此调试器调试模板 如果您的问题只是在代码中放置断点 这是一个小片段 例如 main cpp include
  • 32/64 位的 MSBuild 和 $(ProgramFiles) 问题

    我编写了一个自定义 MSBuild 任务 它调用SubWCRev exe 一个可执行文件 通常 驻留在C Program Files TortoiseSVN bin 无论是 32 位还是 64 位 因为 TortoiseSVN 提供这两个版
  • 隐藏地图注释而不删除它们

    使用 MKMapView 我加载了一堆注释 并且我希望能够过滤使用分段控件显示的注释 我使用带有类型变量的自定义注释 这样我就可以将它们彼此区分开来 但我无法找到一种方法来随意隐藏和显示注释视图的子集 当然可以 试试这个 Objective
  • 在ajax请求中设置$_SESSION

    我有这个 Jquery Ajax 函数可以在网页中登录 url ajax type POST url url data success function jsonResponse var json JSON parse jsonRespon
  • AWS IoT - 通过.Net、REST 和证书访问影子

    为了学习 AWS IoT 我创建了一些 事物 一个策略 我什至能够使用 IoT CLI 来列出事物 or 列表策略 我什至可以通过 CLI 更新影子更新事物通过 CLI 命令 但是一旦我尝试通过 REST GET POST 请求 通过 Ne
  • 如何使用 Homebrew 在 osx macOS Mojave 上安装 Java 8?

    目前 某些应用程序仍然需要 Java 8 例如 Android SDK Android Studio Jenkins 离子 With brew install java the latest版本已安装 但是如何安装Java 8呢 旧的 Or
  • pre 内的代码在 IE8 上排成一行

    我试图从 a 中获取价值textarea并将其放入一个pre tag 它在 chrome 和 mozilla 上工作正常 但在 IE8 上 整个内容保留在一行中pre tag jsbin链接 http jsbin com uwunug 4
  • 如何在dojo中加载一个不是模块的JS文件?

    首先我要说的是 我是一个 javascript 和 dojo 菜鸟 不过 我一直在使用 D O H 框架为我的 js 代码编写一些单元测试 我注意到的一件事是该框架似乎没有办法模拟 XHR 请求 所以我决定使用 sinon 来进行嘲笑 这是
  • Swift 协议专用通用协议

    是否有可能有一个专门针对通用协议的协议 我想要这样的东西 protocol Protocol RawRepresentable typealias RawValue Int 这确实可以编译 但是当我尝试访问init or rawValue从
  • 在批处理脚本中实施“which”命令

    我试图制作一个像这样的脚本which 所以我想检查这个命令是内部命令还是外部命令或两者兼而有之 我尝试执行程序 但是当程序 例如 exe 不正确时 我的程序退出时出现错误 所以我尝试调用help对于这个程序 但现在如果我尝试检查例如echo
  • 如何使用 Charles Proxy 设置 Android Lollipop 模拟器?

    我一直在遵循其他问题的指示 例如如何在 Windows 上使用 Charles Web Proxy 和最新的 Android 模拟器配置 SSL 证书 https stackoverflow com questions 3976728 ho
  • JLabel 中有两个图标?

    我在 JLabel 中有一个图标 如下所示 是否可以在颜色图标和文本之间添加另一个图标 例如代表国家的国旗 例如 我想在红色图标和US 谢谢 是的 在容器标签中使用嵌套的 JLabel 和 BoxLayout JLabel containe
  • 唯一性约束(逗号、分隔、属性)如何与 CoreData 中的 Swift 配合使用?

    我刚刚注意到 CoreData 中的每个唯一性约束可以有多个属性 逗号 分隔 属性 但我实际上不知道在一个约束中拥有多个属性会做什么 这是否意味着如果其中任何一个是唯一的 那么约束就不会被打破 Apple 文档并不是特别有帮助 约束 按照配
  • 子类化 ctypes - Python

    这是我在互联网上找到的一些代码 我不确定它是如何使用的 我简单填写了members使用枚举键 值并且它可以工作 但我很好奇这个元类是关于什么的 我假设它与 ctypes 有关 但我找不到关于子类化 ctypes 的太多信息 我知道 Enum
  • 将当前 URL 的结束字符替换为小书签

    有没有办法通过 javascript bookmarklet 将 currentURL 中最后一个反斜杠之后的所有字符替换为另一个字符串 我正在对 Sharepoint 网站进行大量审核工作 并且必须通过在 URL 末尾输入字符串来手动查看
  • 在 C++ 中使用 MinGW 嵌入 python3.6 链接失败

    尝试在Win10 64位系统上将python3 6嵌入到C 中 Python 的安装方式是python 3 6 1 amd64 exe CMakeList txt 显示如下 cmake minimum required VERSION 3
  • 计算嵌套 mongodb 文档中的出现次数并保留组

    我有这些文件 question 1 answer Foo question 1 answer Foo question 1 answer Bar question 2 answer Foo question 2 answer Foobar
  • 迭代或惰性储层采样

    我非常熟悉使用储层采样在一次数据传递中从一组未确定的长度中进行采样 在我看来 这种方法的一个限制是 在返回任何结果之前 它仍然需要遍历整个数据集 从概念上讲 这是有道理的 因为必须允许整个序列中的项目有机会替换先前遇到的项目以获得统一的样本
  • 如何将 PostgreSQL hstore/json 与 JdbcTemplate 一起使用

    有没有办法使用 PostgreSQL json hstoreJdbcTemplate esp查询支持 for eg hstore INSERT INTO hstore test data VALUES key1 gt value1 key2
  • 限制tinyMCE中的字符数

    我在用着tinyMCe对于我的项目 一切正常 但现在我想限制插入的字符数tinyMce文本区域 tinyMCE init General options mode textareas theme simple plugins autolin