Можно ли захватить дополнительный текст вокруг выделенного?
Есть какой-то врагмент текста. Например:
<p>Наша Маша громко плачет <b>уронила</b> в реку мячик...</p>Через jQuery я могу повесить на тег <B> событие, что при нажатии на него фраза которая в этом теге буде передана мне скажем через ajax (не важно как передаётся, хоть просто в alert выводится). Это легко... А можно как-то сделать чтобы кроме этой фразы я получил ещё 10 символов до неё и 10 символов текста после неё? |
Может выше написал не ясно, по этому решил приложить код:
<p>Наша Маша громко плачет <b>уронила</b> в реку мячик...</p> <script src=jQuery.js></script> <script> $(document).ready(function() { $('b').click(function() { alert($(this).text()); }); }); </script>Имеется текст в котором выделены слова. Если нажимаешь на выделенное слово - оно выводится (в данном случае выведется слово "уронила"). Но задача чтобы выводилось не только это слово, а более глубокий захват, дполнительно по 10 символов с обеих сторон. Ну к примеру в данном случае это было бы - "плачет <b>уронила</b> в реку" (или без тегов). Ну может быть у кого-нибудь есть хотя бы теоретические идеи? |
Теоретическая идея такова: берём элемент, смотрим соседние узлы. Если они текстовые, то берём 10 символов из них (если там меньше, то идём к другим соседям, возможно, поднимаясь вверх по иерархии), если узлы не текстовые, а обычные элементы, то смотрим их содержимое.
|
я бы так сделал:
1. берём содержимое текущего (кликнутого) элемента (в вашем случае, "уронила"). 2. берём html() родителя кликнутого элемента (получится: "Наша Маша громко плачет <b>уронила</b> в реку мячик..."). 3. удаляем теги 4. регуляркой берём 10 символов до "уронила" и 10 символов после. |
T-sh,
Это совершенно не правильный подход! В тексте слово "уронила" может встречаться много раз и часть из них может быть также выделена тегами. В том-то и задача, чтобы получить символы до и после именно вокруг того слова, по которому кликнули! B@rmaley.e><e, Всё правильно, придётся идти вверх по иерархии... Но ведь тег "В" не разбивает фрагмент параграф на соседние узлы! Я могу посмотреть содержимое тега В - "уронила". Я могу подняться на родителя, и увижу содержимое параграфа - "Наша Маша громко плачет <b>уронила</b> в реку мячик..." Но я не получу соседние узлы типа "Наша Маша громко плачет" и "в реку мячик..." |
Цитата:
тут дело вкуса: кому-то нравится перебирать элементы, а кому-то легче со строкой работать. |
T-sh,
Если я могу получить позицию вхождения моего объекта в родителе - это полностью решает вопрос. А переберать элементы всё равно придётся, ведь мне не надо чтобы в текст (в случае если он вначале/конце) вошол новостной блок или пункты меню из шапки сайта. Правда это уже технические мелочи... Но как получить эту позицию текста в которой тот объект по которому кликнули? |
Цитата:
да много способов.. для начала нужно определиться, в каких тегах заключены "кликабельные" слова/фразы. если по примеру <b> .. </b>, то в итоге примерно так: по клику на него обернуть в нейтральный тег, который заведомо не встречается на странице, допустим <h6>..</h6>. всё. берем родительский .html(). в нём сначала ваши все заморочки с новостными блоками и прочим (удалить лишние теги и т.д.), а потом: от позиции первого (единственного) вхождения "<h6>" -10 символов, от позиции первого (опять-таки единственного) вхождения "</h6>" +10 символов :) готово. |
вместо тега можно просто добавлять какой-нибудь непечатный символ.
(позиция вхождения символа)-3 = начало нашего кликнутого элемента (позиция вхождения символа)+ длина содержимого + 4 = конец нашего кликнутого элемента. 3 — это тег "<b>" 4 — "</b>" |
Вложений: 1
Да, я не подумал что можно заменить на что-то уникальное, и потом вернуть обратно...
Завернуть легко - $(this).wrap('<strong>'); а как потом вывернуть? (избавиться от обёртки) Я думал типа: x=$(this); z=$(this).parent(); z=x; Но наверно что-то делаю не так. Ошибки не возникает, но встроенный в IE девелоупер тул, показывает: ![]() Кстати ни как не могу понять, как видно на картинке, после оборачивания в strong мой старый B получил параметр jQuery17108889328545285118=1, но если я вывожу $(this).parent().html() я его не вижу, просто добавился стронг и всё: Наша Маша громко плачет <strong><b>уронила</b></strong> в реку мячик... |
Часовой пояс GMT +3, время: 21:04. |