javascript - quill.formatText() 不允许嵌套格式

标签 javascript jquery html text-editor quill

我正在使用quill.formatText()向我的文本编辑器添加自定义“突出显示”格式。我像这样扩展了一个印迹:

let Inline = Quill.import('blots/inline');
class highlight extends Inline {
    static create() {
      return super.create();
    }

    static formats() {
      return true;
    }
}
highlight.blotName = 'highlight';
highlight.className = 'highlight';
highlight.tagName = 'span';
Quill.register(highlight);

然后我调用quill.formatText(start, selectionLength, 'highlight', true); ,它将我的选择包装在 <span class="highlight"> 中标签。到目前为止,一切都很好。

问题是,我希望每个选择都包含在自己的 span 中标签。当我对文本进行两次选择时,一个在另一个之内,只有外部 span遗迹。

例如,文本 test inside text 。如果除了单词 inside 之外我还突出显示整个字符串,我期望得到:

<span class="highlight">Test <span class="highlight">inside</span> text</span>

而我实际上得到:

<span class="highlight">Test inside text</span>

这似乎是 QuillJS 在幕后进行的优化 - 无论如何我可以将其关闭,以便我可以保持两者嵌套 span是吗?

最佳答案

这不仅仅是一个优化——它对于 Quill 的确定性保证是必要的。如果您有一些文本“Test inside text”并说它是粗体,Quill 保证输出为 <strong>Test inside text</strong> ,不是<strong>Test inside </strong><strong>text</strong><strong>Test <strong>inside</strong> text</strong>或无限数量的 HTML 合法选项。

Quill 的设计是明确的,因此您可以消除设计中的歧义,或者使用允许它的编辑器。

关于javascript - quill.formatText() 不允许嵌套格式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41797752/

相关文章:

jquery:如何通过 .click() 删除处理程序设置?

jquery - 如何更改 svg 饼图切片从顶部开始并使用 jquery 动态制作顺时针动画

javascript - 使用 JS 和 CSS 更改打开的链接颜色

javascript - 无法在 Canvas 上拖放按钮

javascript - 使用 JQuery/Javascript 访问 iFrame URL

html - <a href> 的背景颜色无法在列表中正确显示

javascript - 如何在 Ngrx 9.x 中设置状态值?

javascript - 从一组文件名中预加载一堆图像,完成 50% 后执行功能

javascript - 带有 map 区域的 AJAX 动态页面内容

javascript - 在nativescript中使用tap函数传递参数