如何检索 CKEDITOR.status “就绪”？

Posted 2023-02-16

【中文标题】如何检索 CKEDITOR.status “就绪”？

【英文标题】：How to retrieve the CKEDITOR.status "ready"?

【发布时间】：2013-08-29 22:49:18

【问题描述】：

在我的脚本中，我想等待 CKEDITOR 处于状态 ready，然后再让我自己的指令按照他们的方式进行。于是我咨询了CKEDITOR API，写了如下条件：

if(CKEDITOR.status == "ready")
 //execute my code when ready

但是，状态永远不会从 loaded 更改为 status。显然我什至没有看到任何其他状态。

更具体的任务，我想捕捉 CKEDITOR 完成修改 contenteditable="true" 的内联替换的那一刻。那时我想继续编写我的 JS 代码。

有什么线索吗？

【问题讨论】：

我不确定 CKEDITOR.status 或“已加载”事件在 CKEditor 4 中是否有效，因为 AFAIK “延迟加载”系统是 CKEditor 的另一部分，随着引入4.x 系列。即使它们有效，它们也与页面中编辑器的初始化无关，您必须为每个 instanceReady 使用侦听器，如提供的答案所示。

【参考方案1】：

如果您想在 API 完全加载时执行您的代码，请使用 CKEDITOR.loaded 事件：

CKEDITOR.on( 'loaded', function( evt ) 
    // your stuff here
 );

如果您想在任何新实例准备就绪时执行您的代码，请使用CKEDITOR.instanceReady event：

CKEDITOR.on( 'instanceReady', function( evt ) 
    // your stuff here
 );

如果您想在 特定实例 准备就绪时执行代码，请使用 CKEDITOR.editor.instanceReady 事件：

CKEDITOR.replace( 'editor', 
    on: 
        instanceReady: function( evt ) 
            // your stuff here
        
    
 );

【讨论】：

提示：事件触发器在evt.editor内的编辑器，evt.editor.element.$内的原始元素

@oleq 你能在 ckeditor5 文档版本中添加如何做到这一点吗？

@always-a-learner 在 CKEditor 5 中，当您调用 ClassicEditor.create( ... ).then( editor => console.log() ) 承诺链时，编辑器实例已在 then() 块中准备就绪。 Learn more.

【参考方案2】：

CKEDITOR 中没有ready 状态，你可以使用loaded like：

if ( CKEDITOR.status == 'loaded' ) 
    // The API can now be fully used.
    doSomething();

或使用instanceReady，例如：

CKEDITOR.on('instanceReady', function(evt) 
   //ready
  //do something
);

【讨论】：

是的，下面只有这些，按顺序排列。但是，我想抓住 CKEDITOR 完成修改 contenteditable="true" 的内联替换的那一刻。任何线索。 unloaded：API 尚未加载。 basic_loaded：基本 API 功能可用。 basic_ready：基本 API 已准备好加载完整的核心代码。已加载：API 可以完全使用。

@feder 在这种情况下你可以使用'insanceReady'

【参考方案3】：

正如@Sudhir 所指出的，直接属性值和instanceReady 方法之间存在细微差别。

如果您需要在 CKEDITOR 不仅完成其加载过程，而且完成整个后处理时收到通知，请使用事件侦听器。特别是 html 替换和注入。