Question

我正在使用summernote WYSIWYG插件，并根据用户操作（如按钮单击）添加DOM元素（按钮，链接等）。 insertNode API将一个节点添加到编辑器区域，但它将光标留在该节点内（即光标位于<button></button>标签内。

如何确保光标超出最新的插入节点？

Answer 1

我遇到了同样的问题，我提出的解决方案是在节点插入后立即插入一个空格字符。

editor.insertNode($editable, $(rawHTML)[0]);
editor.insertText($editable, ' ');

这实际上解决了我的两个问题，因为我也希望在两个按钮之间留有空间，一个接一个地添加。

我知道这不是你想要的，但我认为这是最优雅的解决方案，因为更改insertNode的功能可能会产生其他影响。

Answer 2

使用：保存光标的最后位置

$('#summernote').summernote('editor.saveRange');

然后

$('#summernote').summernote('editor.restoreRange');
$('#summernote').summernote('editor.focus');
$('#summernote').summernote('pasteHTML', <YOUR HTML>);

Answer 3

以下对我有用（summernote v0.8.18）：

$input.summernote("pasteHTML", newContent + "&nbsp;");

归功于@Meowcate，它在评论中提到了这种方法，但是在那里使用了空格字符，这对我不起作用，因为插入后没有光标可见。我需要附加“ ”而不是空格。

Summernote位置光标在插入节点之外

3 个答案: