CKEditor5内联构建在h1标记内放置一个p标记 - 如何禁用它?

问题描述 投票:1回答:1

我正在尝试使h1标签可编辑。

我的HTML是

<h1 id="theh1">
    Hello how are you?
</h1>

我的JS是

e = document.getElementById("theh1");
InlineEditor
    .create( e,{
        removePlugins: [ 'Heading', 'Link' ],
        toolbar: [ 'bold', 'italic', 'bulletedList', 'numberedList', 'blockQuote' ]
      } )
      .catch( error => {
          console.error( error );
      } );

这是一个JSFiddle:https://jsfiddle.net/r66uhfee/3/

如果你查看源代码,你会看到h1标签在编辑后有一个p元素。如何禁用此行为?

ckeditor ckeditor5
1个回答
2
投票

不幸的是,CKEditor 5还不支持这种开箱即用。 Allow enabling all types of editors on paragraph-like root票证中描述了此功能。

但是,此功能可能非常容易添加。关键的代码行在每个编辑器创建者中,如下所示:

https://github.com/ckeditor/ckeditor5-editor-classic/blob/d46af9fe4627da3f2f0b29349b1cbdabdf550637/src/classiceditor.js#L74

this.model.document.createRoot();

使用默认值调用createRoot()方法,因此它始终创建一个名为$root的根,schema将其配置为仅允许块(如段落和标题)。

如果您创建了一个名为paragraph的根,那么该根只允许其中的文本,编辑器将停止创建段落:

this.model.document.createRoot( 'paragraph' );

您可能需要解决的另一件事是,在这种特殊情况下,某些功能可能依赖于此paragraph在架构中被标记为limit element,因此,在类似段落元素的特定编辑器中,它' d也可以这样做:

editor.model.schema.extend( 'paragraph', { isLimit: true } );

但是,我们没有对此进行测试,我们还没有为它设计合适的自动解决方案,这就是故障单仍然打开的原因。所以 - 框架应该允许这样,但实现不考虑这种情况。

© www.soinside.com 2019 - 2024. All rights reserved.