从javascript中选择CKEditor中的文本范围

Question

我想在CKEditor中选择特定的文本。我用下面的：

var sel = editor.getSelection(); 

var element = sel.root; 
console.log(element); 
sel.selectElement(element); 
var findString = 'foobar'; 
var ranges = editor.getSelection().getRanges(); 
var startIndex = element.getHtml().indexOf(findString); 

if (startIndex != -1) { 
    ranges[0].setStart(element.getFirst(), startIndex); 
    console.log(element.getFirst() +" - "+ startIndex); 
    console.log(element.getFirst() +" - "+ startIndex + findString.length); 
    ranges[0].setEnd(element.getFirst(), startIndex + findString.length); 
    sel.selectRanges([ranges[0]]); 
} 

它工作正常，如果它是不换行纯文本。 如果我要选择的文本是第二行之后，或者它格式化，我得到以下错误：

Uncaught Error: IndexSizeError: DOM Exception 1

到底哪里出问题了？

Answer 1

我重新访问了你的代码，并将其改为“一点点”。下面的代码将在编辑内容选择所有出现的单词“的”：

// Note: your instance name may differ. 
var editor = CKEDITOR.instances.editor1, 
    selection = editor.getSelection(), 
    root = selection.root, 
    textNodes = [], 
    ranges = [], 
    range, text, index; 

function getTextNodes(element) { 
    var children = element.getChildren(), 
     child; 

    for (var i = children.count(); i--;) { 
     child = children.getItem(i); 
     if (child.type == CKEDITOR.NODE_ELEMENT) 
      getTextNodes(child); 
     else if (child.type == CKEDITOR.NODE_TEXT) 
      textNodes.push(child); 
    } 
} 

// Recursively search for text nodes starting from root. 
// You may want to search a specific branch starting from other element. 
getTextNodes(root); 

// Iterate over found text nodes. If some contains 
// phrase "the", create a range that selects this word. 
for (i = textNodes.length; i--;) { 
    text = textNodes[ i ]; 
    index = text.getText().indexOf('the'); 
    if (index > -1) { 
     range = editor.createRange(); 
     range.setStart(text, index); 
     // Note: 3 is fixed length of "the". You may want to change it. 
     range.setEnd(text, index + 3); 
     ranges.push(range); 
    } 
} 

// Select all ranges "containing" phrase "the". 
selection.selectRanges(ranges); 

请注意，如果你运行在Chrome或IE浏览器的代码，只有第一次出现将被选中。 只有Firefox支持多重选择，结果应该是这样的：

我希望这个例子可以帮助您解决了这个问题。