javascript - 在 'html.set' 或 'snapshot.restore' 之后保留 Froala 编辑器中的插入符位置

Question

我正在尝试将 Froala 编辑器合并到 React 组件中，但在使用“html.set”或“snapshot.restore”方法更新编辑器中的内容后，我很难保持插入位置。

目标是将 Froala 的编辑器内容保持在 React 的状态(使用 Flux 存储):

抓取 HTML(并随后将其存储在 Flux 存储中)不是问题:

var content = $('#editor').froalaEditor('html.get', true);

但是，当尝试将状态刷新回 Froala 时:

$('#editor').froalaEditor('html.set', this.state.content);

新的 HTML 更新没有问题，但插入符号停止闪烁。编辑器仍然有焦点，但输入的任何新文本都会插入任何 <p> </p> 之外标签内容。这有效地使插入符号从最后一个位置向上移动。

或者，使用以下方法拍摄和恢复快照:

var snap = $('#editor').froalaEditor('snapshot.get');
$('#editor').froalaEditor('snapshot.restore', snap);

将插入符号移动到编辑器的左上角位置。

在设置 HTML(或恢复 snapshop)后，是否有办法获取插入符位置并重新聚焦于该位置？

这是使用 Froala 2.0.0-rc2，但最新的 1.x 版本中存在相同的行为。

Answer 1

恢复快照应该可以。如果您可以使 jsFiddle 无法正常工作，您可以在 Github repo 上报告它.

另一种方法是在获取 HTML 之前调用 selection.save，这样您就可以获取带有适当标记的 HTML。然后，如果您的 HTML 带有选择标记，则光标将放置在它之前所在的位置。