Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   DOM - вопрос (https://javascript.ru/forum/misc/41656-dom-vopros.html)

Cruperman 24.09.2013 00:12

DOM - вопрос
 
Привет!
Возникла вот такая проблема. Уже второй день бьюсь над её решением.
Суть:
Есть текст, заключеный в тег span. Например:
<span id="MainText">Ночь, улица, фонарь, аптека,<br>Бессмысленный и тусклый свет.<br>Живи еще хоть четверть века -<br>Все будет так. Исхода нет.<br><br>Умрешь - начнешь опять сначала<br>И повторится все, как встарь:<br>Ночь, ледяная рябь канала,<br>Аптека, улица, фонарь.<br></span>

Есть кнопка.
Пользователь выделяет кусок текста и нажимает на эту кнопку.
В результате выполняется скрипт:
var selection = window.getSelection();
		anchorOffset = selection.anchorOffset; //Начало выделения
		focusOffset = selection.focusOffset; //Конец выделения
		anchorNode = selection.anchorNode; //Контейнер, в котором находится выделенный фрагмент
		
	if( selection.length != 0 ) {
		alert( anchorOffset  + ',' + (focusOffset - anchorOffset) );
		alert( anchorNode.data );
	}


Все работает, но...
anchorNode = selection.anchorNode; //Контейнер, в котором находится выделенный фрагмент

Как контейнер он выведет строку, в которой находится выделенный фрагмент, т.е. то, что находится между тегами <br>..<br> в моем случае.
Следовательно отсчитывать начало и конец выделения он будет от начала этого контейнера.
Мне же нужно, чтобы за контейнер он принимал все, что находится внутри span и отчитывал начало и конец выделения от начала текста, а не от начала строки.

Помогите, пожалуйста. :help:

Fronnt 24.09.2013 09:58

Привет.
//нужно определить тип узла - для текстовых идем вверх по дереву к родителю
if(selection.anchorNode.nodeType === 3){
anchorNode = selection.anchorNode.parentNode;
}

я не знаю что ты хочешь сделать, но если выделять текст - то я бы избрал иной путь

Cruperman 24.09.2013 22:46

Fronnt, мне нужно узнать начало и конец выделения в тексте.

Спасибо.

Fronnt 24.09.2013 23:36

В смысле помог или я все таки недопонял вопрос? :)

Cruperman 24.09.2013 23:51

Fronnt, получилось достать весь текст с тегами из родителя.
С этим понятно.
Но не получается узнать границы выделения относительно всего текста, т.е. родителя.
В режиме отладки поискал свойства у window.getSelection(), но ничего толкового не нашел.
Возможно плохо искал, но там слишком много вложений.

Ты говорил про другой способ...

Еще раз объясню: мне нужно получить границы выделения относительно всего текста (который находится в <span>...</span>).

Заранее спасибо. Пойду дальше искать.

Яростный Меч 25.09.2013 00:13

Придется вручную считать.

Сначала взять range:
if( selection.rangeCount ) {
   var range = selection.getRangeAt(0);
   ...
}


потом выяснить, является ли range.commonAncestorContainer твоим спаном или его потомком (если нет, то выделение выскочило за границы спана).

ну и далее разбираться со свойствами range (startContainer, endContainer, startOffset, endOffset). а именно, посчитать суммарную длину текста всех текстовых узлов до startContainer, добавить туда же все <br> (их считаем как один символ), то же самое между startContainer и endContainer и т.д.
может оказаться, что startContainer и/или endContainer окажутся спаном, тогда оффсеты соответствуют позиции чилда.

короче, тут много всяких деталей.

Тут все расписано. Если тебе ещё и для IE надо делать, то вообще "везунчик" :)

Яростный Меч 25.09.2013 00:14

скучно не будет - это я гарантирую :D

Fronnt 25.09.2013 12:39

Слушай, я бы на твоем месте поковырял исходники MashaJS они есть на гитхабе, на память, вроде русскими написана или украинцами. Там мало кода, но сделано качественно, кроссбраузерно, без багов.
http://mashajs.com/ на странице указаны подробные контакты разработчиков;)

Fronnt 25.09.2013 13:24

Решил таки сесть за ноут.
Я вообще туповат, и соотв мог неверно понять вопрос, но если тебе нужно получить начало и конец текста в span (на самом деле вообще пофиг откуда), то можно выполнить простой поиск по тексту (через innerText или innerHTML - надо смотреть что подходит).
Вот мой прототип, не претендую на качество, объясняю лишь суть, но работает.
anchorNode.innerText.search(selection.toString())
//потом мычислим длину выделенного и прибавим к числу сверху и получим конец
//+ selection.toString().length

Cruperman 25.09.2013 19:41

Fronnt, проблема в том, что в тексте может несколько раз встречаться одно и тоже предложение.

MaSha - хорошая идея. Будет время. Посмотрю.


Часовой пояс GMT +3, время: 01:42.