javascript для получения абзаца выделенного текста на веб-странице

Question

После выделения текста я хотел бы получить абзац, в котором находится выделенный текст.

var select = window._content.document.getSelection();

Какие-нибудь указания, пожалуйста?

Answer 1

На самом деле это довольно сложно сделать, потому что вам нужно рассмотреть шесть случаев:

1. Выделение не находится в пределах абзаца (легко);
2. Весь выбор находится в пределах одного абзаца (легко);
3. Весь выделенный фрагмент пересекает один или несколько родственных абзацев (сложнее);
4. Выделение начинается или заканчивается элементом, не входящим в абзац (сложнее);
5. Охватываемые абзацы находятся на разных уровнях, например, один находится внутри элемента списка, в то время как два других являются родственными элементами списка (еще сложнее);и
6. Некоторая комбинация из вышеперечисленного.

Итак, сначала вы должны решить, насколько полным вы хотите видеть решение.Я рассмотрю только простейшие случаи (1) и (2).

function getSelectedParagraphText() {
  if (window.getSelection) {
      selection = window.getSelection();
  } else if (document.selection) {
      selection = document.selection.createRange();
  }
  var parent = selection.anchorNode;
  while (parent != null && parent.localName != "P") {
    parent = parent.parentNode;
  }
  if (parent == null) {
    return "";
  } else {
    return parent.innerText || parent.textContent;
  }
}

Примечание: Если вам тоже нужны теги, замените textContent на innerHTML .

Редактировать: Введена улучшенная версия, включая лучшую совместимость с браузером.

Answer 2

Я нашел это полезным пример.

Похоже, что некоторые браузеры поддерживают window.getSelection(), в то время как другие поддерживают document.getSelection().В примере рассматриваются все эти случаи.

Answer 3

select.anchorNode.parentNode вернет родительский узел, в вашем случае

пометьте, и затем вы сможете получить текст этого узла.

var x = window.getSelection() 
var z = x.anchorNode.parentNode
alert(z.innerHTML)

Убедитесь, что вы также смотрите на window.getSelection(), поскольку document.getSelection обесценивается в Firefox.

Answer 4

$.event.props.push('onTextSelect');
$(document).click(function(){
    var str=window.getSelection().anchorNode.data;
    var str=str.substring(window.getSelection().anchorOffset,window.getSelection().focusOffset);
    if(str)
        $(window.getSelection().focusNode.parentNode).trigger({type:'onTextSelect',text:str});
});

$('p').on('onTextSelect',function(e){
    console.log($(this).attr('class'))
    $('p:last').text(e.text);
});

HTML

<div><p class="p">some text</p></div>
<p></p>

Вы можете найти скрипку здесь https://jsfiddle.net/q9nkc0fd/6/

Answer 5

Новый проект рождается из jsmatita:http://takenotes.sourceforge.net/ (это на итальянском языке)