tinyMCE - 获取内容到光标位置 [英] tinyMCE - get content up to cursor position

问题描述

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

我需要提取文本的一个子集，该文本以光标位置前面的字母结尾，然后从，文本的开头。如果可能的话，我可以自己剥离HTML标签，但我更愿意让tinyMCE尽可能这样做。

我想这样做：

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


2. 创建范围从文本开头到我的书签。


3. 获取范围的内容。


4. 删除书签。

现在，因为我不熟悉那对我来说已经证明有点挑战的tinyMCE，所以怎么会这样做呢？ / p>

代码需要跨浏览器工作。

解决方案

你可以试试这段代码片段（ed是tinymce编辑器对象）

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

  ed.execCommand（'mceInsertContent'，false，'< span class =marker > \\\< /跨度>'）; 
  

B.创建从文本开头到书签的范围。

  var rng = ed.selection.getRng（1）; 
 var rng2 = rng.cloneRange（）; 
 
 //设置最开始段落的开始范围
 rng2.setStartBefore（$（ed.getBody（））。find（'p：first'）。get（0）） ; 
 
 rng2.setEndBefore（$（ed.getBody（））。find（'span.marker'）。get（0））; 
 ed.selection.setRng（rng2）; 
  

C.获取范围的内容。

  //获取选择内容（范围）
 var content = ed.selection .getContent（{format：'text'}）; 
  

D.删除书签。

  $（ed.getBody（））。find（'span.marker'）。remove（）; 
  

更新如果您担心选择更改，可以重置初始范围

  ed.selection.setRng（rng）; 
  

I am making a little word prediction plugin for tinyMCE and need to extract a bit of text and later insert text from a list of predicted words. The insertion should be no problem, as I know where the cursor is and can use the mceInsertContent command. Getting the text for the prediction however...

I need to extract a subset of the text ending at the letter immediately before the cursor position and starting at, well, the start of the text. I can strip HTML tags myself if neccessary, but I prefer letting tinyMCE do it if possible.

I was thinking of doing it like this:

1. Insert bookmark at current cursor positon using mceInsertContent
2. Create a range from start of text up to my bookmark.
3. Get the content of the range.
4. Delete the bookmark.

Now, since I'm not that well versed in tinyMCE that has proved to be a bit of a challenge for me, so how would one go about doing this?

The code needs to work cross-browser.

解决方案

You may try this code snippets (ed is the tinymce editor object)

A. Insert bookmark at current cursor positon using mceInsertContent

ed.execCommand('mceInsertContent', false,'<span class="marker">\ufeff</span>');

B. Create a range from start of text up to my bookmark.

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);

C. Get the content of the range.

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

D. Delete the bookmark.

$(ed.getBody()).find('span.marker').remove();

Update: If you are concerned about the selection change you may reset your initial range

ed.selection.setRng(rng);

这篇关于tinyMCE - 获取内容到光标位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！