Javascript zu bekommen Absatz von ausgewähltem Text in Web-Seite

Question

Nach dem Markieren Text, ich möchte den Absatz erhalten, in dem der ausgewählte Text befindet.

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

Alle Hinweise bitte?

Answer 1

Das ist eigentlich ziemlich schwer zu tun, weil man sechs Fälle zu betrachten hat:

1. Die Auswahl ist nicht innerhalb eines Absatzes (leicht);
2. Die gesamte Auswahl ist innerhalb eines Absatzes (leicht);
3. Die gesamte Auswahl kreuzt ein oder mehrere Geschwister Absätze (härter);
4. Die Auswahl beginnt oder endet in einem Element nicht innerhalb eines Absatzes (härter);
5. Die Absätze aufgespannt sind auf verschiedenen Ebenen, zB eine in einem Listenelement ist, während zwei andere Geschwister der Liste (noch härter) sind; und
6. Eine Kombination der oben genannten.

Also erstens müssen Sie entscheiden, wie vollständig Sie die Lösung sein wollen. Ich werde nur decken die einfachsten Fälle von (1) und (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;
  }
}

. Hinweis: Wenn Sie nach Tags mit textcontent innerHTML- zu ersetzen

Edit:. Bessere Version setzt in, einschließlich einem besseren Browser-Kompatibilität

Answer 2

Ich fand dieses nützlich Beispiel .

Es scheint, dass manche Browser unterstützen window.getSelection (), während andere unterstützen document.getSelection (). Das Beispiel behandelt all diese Fälle.

Answer 3

select.anchorNode.parentNode wird den übergeordneten Knoten zurückkehren, in Ihrem Fall den

-Tag und Sie können dann den Text dieses Knotens erhalten.

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

Stellen Sie sicher, dass Sie sehen window.getSelection () als auch seit document.getSelection in firefox abgeschrieben wird.

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>

Sie können die Geige hier finden https://jsfiddle.net/q9nkc0fd/6/

Answer 5

Ein neues Projekt wird von jsmatita geboren: http://takenotes.sourceforge.net/ (Es ist in italienischer Sprache)