ckeditor - 获取 CKEditor 4 中已编辑元素的 HTML 中的光标位置

Question

我使用内联 CKEditor 来编辑页面上的元素。因此，当我单击带有某个类的 DIV 时，CKEditor 会附加到它，当它失去焦点时，编辑器实例将被销毁。我需要在 CKEditor 实例被销毁后将 HTML 元素插入到该 DIV 中 - 在销毁编辑器实例之前插入光标的最后一个位置。所以我基本上需要知道编辑元素的 HTML 中光标的索引，因为它将被视为纯文本(对于下面的示例，它将是 25)。我不想修改原始数据。

我的 DIV 中有这样的 HTML:
"some <span>text</span> wi|th <b>html</b> tags" (其中“|”是光标位置)

我尝试获取范围并将其扩展到可编辑元素的开头:

var range = editor.getSelection().getRanges()[ 0 ];    
range.collapse( true );
range.setStartAt( editor.editable(), CKEDITOR.POSITION_AFTER_START );

这里range.endOffset是 3(与我没有扩展范围相同)。但即使我总结更多元素的偏移量，也无法解决我的问题，因为它排除了 HTML 标签。

Answer 1

如果您想在编辑器被销毁后使用范围，您将无法使用范围，因为在被销毁时，编辑器会用数据替换可编辑的内部 HTML，并且它们不是同一件事。

相反，您应该在编辑器被销毁之前为选择创建一个标记，并在数据中找到该标记。

请参阅此主题以了解如何实现这一目标:Retain cursor position after reloading the page in CKEditor .