javascript per ottenere il paragrafo del testo selezionato nella pagina web

Dopo aver evidenziato il testo, vorrei ottenere il paragrafo in cui si trova il testo selezionato.

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

Qualsiasi suggerimento per favore?

Questo è in realtà piuttosto difficile da fare perché devi considerare sei casi:

  1. La selezione non è all’interno di un paragrafo (facile);
  2. L’intera selezione è all’interno di un paragrafo (facile);
  3. L’intera selezione attraversa uno o più paragrafi di pari livello (più difficile);
  4. La selezione inizia o termina in un elemento non all’interno di un paragrafo (più difficile);
  5. I paragrafi spanning sono a diversi livelli, ad esempio uno è all’interno di una voce di elenco mentre altri due sono fratelli della lista (anche più difficile); e
  6. Alcune combinazioni di quanto sopra.

Quindi, in primo luogo, devi decidere quanto completa vuoi che la soluzione sia. Troverò solo i casi più semplici di (1) e (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; } } 

Nota: se cerchi anche le tag, sostituisci textContent con innerHTML.

Modifica: versione migliorata, inclusa una migliore compatibilità con il browser.

Ho trovato questo utile esempio .

Sembra che alcuni browser supportino window.getSelection () mentre altri supportano document.getSelection (). L’esempio gestisce tutti questi casi.

select.anchorNode.parentNode restituirà il nodo genitore, nel tuo caso il

tag e puoi quindi ottenere il testo di quel nodo.

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

Assicurati di guardare anche a window.getSelection () dato che document.getSelection è deprezzato in firefox.

 $.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

 

some text

Puoi trovare il violino qui https://jsfiddle.net/q9nkc0fd/6/

Un nuovo progetto nasce da jsmatita: http://takenotes.sourceforge.net/ (è in lingua italiana)