selectionStart 및 selectionEnd를 허용하는 서식있는 텍스트 편집기

Question

RTE에 특정 코드 단편을 소개 할 수있는 측면에 RTE (Rich Text Editor) 및 패널이있는 인터페이스를 구현하려고합니다.

정확히 내가 시도하고있는 것은 http://jsfiddle.net/timdown/wPfVn/과 같지만 일반 텍스트 영역 대신 RTE로 처리하려고합니다.

문제는 모든 RTE가 diva 및 iframe 등으로 텍스트 영역을 대체한다는 것입니다. selectStart 및와 같은 텍스트 영역 기능은 커서 위치를 감지하는 데 사용할 수 없습니다.

사용할 수있는 API를 통해 이러한 기능을 제공하는 RTE가 있습니까?

누군가가 어떤 사이트에서 이와 유사한 것을 본 적이 있다면, 저에게 말하십시오. 어쩌면 내가 Ctrl + U를하고 그들이 사용한 것을 알아낼 수 있습니다.

해결 : Magus의 답변 덕분입니다. 하나는 TinyMCE 편집기를 사용할 수 있습니다. 그것에는 선택과 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'); 
}); 

Answer 1

TinyMCE 일부 선택 현재 사용중인 API입니다. 문서 봐 : http://www.tinymce.com/wiki.php/API3:class.tinymce.dom.Selection

약간의 예 :

tinyMce.activeEditor.selection.getContent({format : 'raw'}); // Get the selected text 
tinyMce.activeEditor.selection.getStart(); // Selection start 
tinyMce.activeEditor.selection.getEnd(); // Selection end 

내가 많은 RTE는이 기능을 제공합니다 생각합니다. API 문서를 보면됩니다.