Javascript 允许selectionStart和selectionEnd的富文本编辑器

Javascript 允许selectionStart和selectionEnd的富文本编辑器,javascript,rich-text-editor,Javascript,Rich Text Editor,我正在尝试实现一个界面,其中有一个富文本编辑器RTE和一个面板,允许用户将某些代码片段引入RTE 我所尝试的正是我想要用RTE而不是普通的文本区来做的 问题是所有RTE都用div和iframe等替换textarea。textarea功能(如selectStart和selectionEnd)无法检测光标位置 是否有一个RTE通过我可以使用的API公开这些函数 如果有人在某个网站上看到过类似的东西,请告诉我。也许我可以按住ctrl+u组合键,找出他们使用了什么 已解决: 多亏了法师的回答。可以使用T

我正在尝试实现一个界面,其中有一个富文本编辑器RTE和一个面板,允许用户将某些代码片段引入RTE

我所尝试的正是我想要用RTE而不是普通的文本区来做的

问题是所有RTE都用div和iframe等替换textarea。textarea功能(如selectStart和selectionEnd)无法检测光标位置

是否有一个RTE通过我可以使用的API公开这些函数

如果有人在某个网站上看到过类似的东西,请告诉我。也许我可以按住ctrl+u组合键,找出他们使用了什么

已解决: 多亏了法师的回答。可以使用TinyMCE编辑器。它有一个selection和selection.bookmarks的概念。以下是您如何实现结果

tinyMCE.init({
    mode : "exact",
    elements: "notifierBody",           
});
$('.insertBtn').click(function(){
    // Stores a bookmark of the current selection
    var bm = tinyMCE.activeEditor.selection.getBookmark();
    // Restore the selection bookmark. In effect, takes the control that the bookmark
    tinyMCE.activeEditor.selection.moveToBookmark(bm);
    //Add new content right in the middle where your cursor/selection was
    tinyMCE.activeEditor.selection.setContent('Some new content');  
});
为当前选择获取一些API。查看文档:

举个小例子:

tinyMce.activeEditor.selection.getContent({format : 'raw'}); // Get the selected text
tinyMce.activeEditor.selection.getStart(); // Selection start
tinyMce.activeEditor.selection.getEnd(); // Selection end
我认为很多RTE都提供了这种功能。您只需查看API文档即可