CKEditor Получить предшествующий текст в той же строке

Я использую экземпляр CKEditor и могу вставлять текст в CKEditor в точке курсора. Я хочу иметь возможность захватить весь текст слева от курсора до начала строки.

Я пытался найти координаты X, Y курсора, и это не помогло. Я уверен, что со всеми инструментами CKEDITOR это можно сделать, но я не смог выяснить, какие инструменты использовать вместе, чтобы заставить это работать.

var theEditor = CKEDITOR.instances.editorFull;
sel = theEditor.getSelection();
obj = sel.getStartElement().$;
range = theEditor.getSelection().getRanges();
container = range[0].startContainer.$;
textlen = typeof obj.textContent === "undefined" ? obj.innerText.length : obj.textContent.length;
offset = range[0].startOffset;
if(container.nodeType === 3) {
  while (container.previousSibling) {
container = container.previousSibling;
if(container.length) {
    offset += container.length;
}else{
offset += container.textContent ? container.textContent.length : container.innerText.length;
    }
  }
}
var pct = textlen > 0 ? offset / textlen : 0;
cursor = Math.floor(obj.offsetHeight * pct);
while (obj.offsetParent) {
cursor += obj.offsetTop;
obj = obj.offsetParent;
}
cursor += obj.offsetTop;
alert(cursor);

Это была моя попытка выяснить, где находится курсор, и это работает, но я не совсем уверен, какую информацию я получаю в предупреждении, поэтому мне это не нужно.

То, что я хочу, это гипотетически. В приведенном ниже тексте используется | как курсор, и это будет найдено внутри моего экземпляра CDEditor:

      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ex nunc,      
 tincidunt id |arcu in, semper volutpat nulla. Nunc efficitur egestas magna 
 vitae consequat.

Обратите внимание на | в "id |arcu". Я хочу иметь возможность захватывать текст "tincidunt id" в зависимости от положения курсора. Я не хочу, чтобы он захватывал что-либо с конца строки над этим текстом. По сути, остановитесь на переносе слов.

Любые идеи? Спасибо.

Аллен


javascript dom ckeditor
person j_allen_morris    schedule 16.07.2015    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Употреблен довольно хитрый термин «линия». Что, если геометрия редактора изменится (изменится размер) и текст переместится в какой-то другой точке? Что, если выбор находится в ячейке таблицы, равен ли тогда строка строке таблицы? Что, если <p> разделен на <br> и есть 2 «виртуальных абзаца»?

В HTML нет такой вещи, как строка. Есть элементы, встроенные (например, <span> или <strong>) и блоки (например, <p> или <table>). Чтобы получить HTML-контент от начала ближайшего родительского блока до положения курсора, вам нужно всего лишь:

var e = CKEDITOR.instances.editor1;
var r = e.getSelection().getRanges()[ 0 ];

r.collapse( 1 );
r.setStartAt( ( r.startPath().block || r.startPath().blockLimit ).getFirst(), CKEDITOR.POSITION_AFTER_START );

var docFr = r.cloneContents();

console.log( docFr.getHtml() );
console.log( docFr.$.textContent );
person oleq    schedule 17.07.2015
comment
Есть ли возможность переместить курсор влево на 1 символ / букву и проверить положение курсора x, y и делать это до тех пор, пока значение Y не изменится, что будет означать, что курсор перейдет на следующую строку вверх, как текст был то себе отформатировал? - person j_allen_morris; 17.07.2015
comment
Или, если подумать, причина, по которой мне нужно захватить текст, состоит в том, чтобы определить расстояние между курсором и левой стороной элемента ‹p›. Если бы я мог получить x, y, я полагаю, что значение X сказало бы мне, как далеко я был, или это просто относительное значение от верхнего левого угла текущего окна? - person j_allen_morris; 17.07.2015
comment
Что делает console.log? - person j_allen_morris; 17.07.2015
comment
@j_allen_morris: Если вы задаете такой элементарный вопрос, как console.log, это означает, что вы вообще не пользовались Google. Пожалуйста, сначала ищите, а потом спрашивайте. - person Reinmar; 20.07.2015