我正在使用媒体编辑器。
初始化medium-editor
类的代码为
var editor = new MediumEditor(el, {
placeholder: false,
toolbar: false
})
我正在使用以下方法为我的自定义字段绑定媒体编辑器。
editor.subscribe('editableInput', function (event, currentEditable) {
// my code goes here
}
我的问题是,我无法限制我的媒体编辑器字段的maxLength。我没有找到任何传递给中编辑器类来限制最大字符的选项。
有没有办法限制媒体编辑器中的最大字符?
答案 0 :(得分:0)
目前没有办法限制媒体编辑器字段的长度。 github repo中有一个open issue,讨论如何实现这一目标。
浏览器不在可信字段上提供maxLength属性。还有什么问题是这些字段包含标记,所以如果你要引入maxLength,你需要找到一种方法来忽略所有文本的长度,而是跟踪/限制"可打印字符的数量&# 34 ;.例如:
<b>Bold and <i>italic</i></b>
此文本的全长为29个字符(包括标签),但您可能希望将长度计算为仅15个字符(&#34;粗体和斜体&#34;)。
这是一个stackoverflow帖子,建议限制文本长度的方法,这是媒体编辑器用于WYSIWYG文本的内容:
Limiting Number of Characters in a ContentEditable div
乍一看,该文章中的解决方案本身并不充分,因为它们要么依赖于jQuery(中型编辑器只是vanilla JS),要么依赖于.innerText
元素属性({{{ 3}})。
任何可以在IE&gt; = 9中使用并且不需要jQuery的解决方案可以立即在介质编辑器中引入作为解决问题的功能is not supported in IE < 11 or Firefox < 50
实现这一点的另一个困难部分是如何实际执行长度限制。另一篇stackoverflow文章中提到的解决方案正在监听keyup
和keydown
事件,这些事件允许您检测用户何时键入并调用event.preventDefault()
以防止输入文本。这并不能解释用户将内容粘贴到编辑器中或执行document.execCommand()
的时间(这是浏览器处理内置文本格式的方式)。您可以收听paste
事件,但是如果不允许粘贴发生,您将无法在浏览器中一致地检测到粘贴的内容,然后检查html。
因此,您可能不得不限制对编辑器中的更改作出反应,然后删除字符。这有闪烁文本的丑陋后果,但它是在用户粘贴或document.execCommand()
之类的事情发生时始终限制长度的唯一方法。
input
是检测除IE + Edge之外的所有浏览器的编辑器的任何更改(包括粘贴和document.execCommand()
)的好方法,它们从未支持input
事件满足的领域。但是,MediumEditor公开了一个editableInput
事件,它将在所有浏览器中一致地模拟事件(我恰好编写了标准化,让我告诉你,很难在IE + Edge中伪造输入事件! )。