how to select a text range in CKEDITOR programatically?

六眼飞鱼酱① 提交于 2019-12-19 03:08:29

问题


Problem:

I have a CKEditor instance in my javascript:

var editor = CKEDITOR.instances["id_corpo"];

and I need to insert some text programatically, and select some text range afterwards.

I already did insert text through

editor.insertHtml('<h1 id="myheader">This is a foobar header</h1>');

But I need to select (highlight) the word "foobar", programatically through javascript, so that I can use selenium to work out some functional tests with my CKEditor plugins.

UPDATE 1:

I've also tried something like

var selection = editor.getSelection();
var childs = editor.document.getElementsByTag("p");
selection.selectElement(childs);

But doesn't work at all!

How can I do that?

I think that

selection.selectRange()

could do the job, but I'could not figure out how to use it. There are no examples over there :(


回答1:


Get current selection

var editor = CKEDITOR.instances["id_corpo"];
var sel = editor.getSelection();

Change the selection to the current element

var element = sel.getStartElement();
sel.selectElement(element);

Move the range to the text you would like to select

var findString = 'foobar';
var ranges = editor.getSelection().getRanges();
var startIndex = element.getHtml().indexOf(findString);
if (startIndex != -1) {
    ranges[0].setStart(element.getFirst(), startIndex);
    ranges[0].setEnd(element.getFirst(), startIndex + findString.length);
    sel.selectRanges([ranges[0]]);
}



回答2:


You can also do the following:

get the current selection

var selection = editor.getSelection();
var selectedElement = selection.getSelectedElement();

if nothing is selected then create a new paragraf element

if (!selectedElement)
    selectedElement = new CKEDITOR.dom.element('p');

Insert your content into the element

selectedElement.setHtml(someHtml);

If needed, insert your element into the dom (it will be inserted into the current position)

editor.insertElement(selectedElement);

and then just select it

selection.selectElement(selectedElement);



回答3:


Check out the selectElement() method of CKEDITOR.dom.selection.

http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.dom.selection.html




回答4:


insert text at cursor point in ck editor

  • function insertVar(myValue) { CKEDITOR.instances['editor1'].fire( 'insertText',myValue); }

    this is working for me



来源:https://stackoverflow.com/questions/4401469/how-to-select-a-text-range-in-ckeditor-programatically

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!