Javascript tinyMCE-将内容获取到光标位置

Javascript tinyMCE-将内容获取到光标位置,javascript,tinymce,cursor-position,tinymce-plugins,Javascript,Tinymce,Cursor Position,Tinymce Plugins,我正在为tinyMCE制作一个单词预测插件,需要提取一点文本,然后从预测单词列表中插入文本。插入应该没有问题,因为我知道光标在哪里,可以使用mceInsertContent命令。但是,正在获取预测的文本 我需要提取文本的一个子集,它以光标位置前的字母结尾,从文本的开头开始。如果有必要,我可以自己剥离HTML标记,但如果可能的话,我更喜欢让tinyMCE这样做 我想这样做: 使用mceInsertContent 创建从文本开始到我的书签的范围 获取范围的内容 删除书签 现在,既然我对tinyMCE

我正在为tinyMCE制作一个单词预测插件,需要提取一点文本,然后从预测单词列表中插入文本。插入应该没有问题,因为我知道光标在哪里,可以使用
mceInsertContent
命令。但是,正在获取预测的文本

我需要提取文本的一个子集,它以光标位置前的字母结尾,从文本的开头开始。如果有必要,我可以自己剥离HTML标记,但如果可能的话,我更喜欢让tinyMCE这样做

我想这样做:

  • 使用
    mceInsertContent
  • 创建从文本开始到我的书签的范围
  • 获取范围的内容
  • 删除书签
  • 现在,既然我对tinyMCE不是很精通,这对我来说是一个挑战,那么我们该如何着手呢


    代码需要跨浏览器工作。

    您可以尝试使用此代码段(ed是tinymce编辑器对象)

    A.使用mceInsertContent在当前光标位置插入书签

    ed.execCommand('mceInsertContent', false,'<span class="marker">\ufeff</span>');
    
    C.获取范围的内容

    // get content of selection (range)
    var content = ed.selection.getContent({format: 'text'});
    
    删除书签

    var rng = ed.selection.getRng(1);
    var rng2 = rng.cloneRange();
    
    // set start of range to begin of forst paragraph
    rng2.setStartBefore($(ed.getBody()).find('p:first').get(0));
    
    rng2.setEndBefore($(ed.getBody()).find('span.marker').get(0));
    ed.selection.setRng(rng2);
    
    $(ed.getBody()).find('span.marker').remove();
    
    更新:如果您担心选择更改,您可以重置初始范围

    ed.selection.setRng(rng);
    

    下面是我的解决方案(按下Ctrl键时,该单词将显示在console中):

    功能计数器(chr){
    如果(匹配字符(/[A-Za-z\u00C0-\u00D6\u00D8-\u00f6\u00f8-\u00ff]/i)){
    返回true;
    }
    否则{
    返回false;
    }
    }
    var editor=tinymce.activeEditor;
    var$edBody=$(editor.getBody());
    编辑器.on('KeyUp',函数(e){
    如果(e.code==“ControlLeft”){
    var sel=editor.selection.getSel();
    var caretPos=选择锚定偏移量;
    var txtData=sel.anchorNode.data;
    var i=caretPos;
    var-word=“”;
    而(i>0){
    if(Isleter(txtData.charAt(i))){
    word+=txtData.charAt(i);
    i-=1;
    }
    否则{
    打破
    }
    }
    word=word.split(“”).reverse().join(“”);
    i=caretPos+1;
    while(i

    也许有一个更干净或更优雅的方法来解决这个问题,如果是这样的话,请发表评论,让我们把这个解决方案做得更好。

    可以不选择文本吗?也许,你需要包含所有html标记的内容,还是想要纯文本?
    ed.selection.setRng(rng)作业是否不考虑提取纯文本的HTML-接受您的答案:-)其引发的以下错误:未能在“范围”上执行“setStartBefore”:参数1不是“节点”类型,为什么会出现此错误@木雕
    
    function isLetter(chr){
        if(chr.match(/[A-Za-z\u00C0-\u00D6\u00D8-\u00f6\u00f8-\u00ff]/i)){
            return true;
        }
        else{
            return false;
        }
    }
    
    
    
    var editor = tinymce.activeEditor;
    var $edBody = $(editor.getBody());
    editor.on('KeyUp', function(e){
        if(e.code == "ControlLeft"){
            var sel = editor.selection.getSel();
            var caretPos = sel.anchorOffset;
            var txtData = sel.anchorNode.data;
            var i = caretPos;
            var word = "";
    
            while(i > 0){
                if(isLetter(txtData.charAt(i))){
                    word += txtData.charAt(i);
                    i -= 1;
                }
                else{
                    break;
                }
            }
    
            word = word.split("").reverse().join("");
    
            i = caretPos + 1;
            while(i < txtData.length){
                if(isLetter(txtData.charAt(i))){
                    word += txtData.charAt(i);
                    i += 1;
                }
                else{
                    break;
                }
            }
            console.log(word);
        }
    });