将焦点设置为在焦点CKEditor之后结束

时间:2011-10-05 07:59:05

标签: javascript cursor ckeditor selection caret

  

可能重复:
  CKEditor - Set cursor position to end of text

我有一个含有大量内容的<div>。单击此div后,将加载CKEditor以编辑此div。

现在我想在用编辑器替换它之后将插入符/光标设置到内容的末尾。

我的代码目前是这样的:

var editor = CKEDITOR.replace('content', {
  // Settings

  // Event listeners
  on: {
    instanceReady: function(evt) {
      var editor = evt.editor;

      // give focus (displays caret at the beginning of the content, not the end)
      editor.focus();
    }
  }
});

1 个答案:

答案 0 :(得分:4)

经过一番摆弄后,我可以使用以下代码:

$(document).ready(function() {

    CKEDITOR.on('instanceReady', function(ev) {

        ev.editor.focus();

        var s = ev.editor.getSelection(); // getting selection
        var selected_ranges = s.getRanges(); // getting ranges
        var node = selected_ranges[0].startContainer; // selecting the starting node
        var parents = node.getParents(true);

        node = parents[parents.length - 2].getFirst();

        while (true) {
            var x = node.getNext();
            if (x == null) {
                break;
            }
            node = x;
        }

        s.selectElement(node);
        selected_ranges = s.getRanges();
        selected_ranges[0].collapse(false);  //  false collapses the range to the end of the selected node, true before the node.
        s.selectRanges(selected_ranges);  // putting the current selection there
    }

});

这个想法是:

  1. 获取根节点(不是正文)
  2. 前进到下一个节点,直到没有更多节点前进。
  3. 选择最后一个节点。
  4. 将其折叠
  5. 设定范围