Javascript: Come rilevare se una parola è evidenziata

Question

Sto scrivendo un addon di Firefox che viene attivato ogni volta che una parola viene evidenziata. Tuttavia ho bisogno di uno script che rilevi quando viene evidenziata una parola, e sono bloccato. Un esempio potrebbe essere nytimes.com (quando leggi un articolo e evidenzi una parola, viene visualizzata l'icona di riferimento). Tuttavia, lo script di nytimes.com è super complesso. Ho 16 anni e non un gran programmatore, quindi è decisamente fuori dalla mia portata.

Answer 1

Ecco uno script:

<script language=javascript> 
function getSelText() 
{ 
    var txt = ''; 
     if (window.getSelection) 
    { 
        txt = window.getSelection(); 
             } 
    else if (document.getSelection) 
    { 
        txt = document.getSelection(); 
            } 
    else if (document.selection) 
    { 
        txt = document.selection.createRange().text; 
            } 
    else return; 
document.aform.selectedtext.value = txt; 
} 
</script> 
<input type="button" value="Get selection" onmousedown="getSelText()"> 
<form name=aform > 
<textarea name="selectedtext" rows="5" cols="20"></textarea> 
</form> 

Per gentile concessione di Codice Toad:

http://www.codetoad.com/javascript_get_selected_text.asp

Nel tuo caso, si vorrebbe chiamare questo script quando la selezione è fatta, e poi si può elaborarlo come preferisci, con una richiesta AJAX per ottenere informazioni rilevanti, ad esempio, come probabilmente accade a NYTIME.

Answer 2

Il modo più semplice per eseguire questa operazione è rilevare gli eventi mouseup e keyup sul documento e controllare se è selezionato alcun testo. Quanto segue funzionerà in tutti i principali browser.

Esempio: http://www.jsfiddle.net/timdown/SW54T/

function getSelectedText() { 
    var text = ""; 
    if (typeof window.getSelection != "undefined") { 
     text = window.getSelection().toString(); 
    } else if (typeof document.selection != "undefined" && document.selection.type == "Text") { 
     text = document.selection.createRange().text; 
    } 
    return text; 
} 

function doSomethingWithSelectedText() { 
    var selectedText = getSelectedText(); 
    if (selectedText) { 
     alert("Got selected text " + selectedText); 
    } 
} 

document.onmouseup = doSomethingWithSelectedText; 
document.onkeyup = doSomethingWithSelectedText; 

Answer 3

Utilizzando rangy.js e jQuery:

$('#elem').on('keyup mouseup', function(){ 
    var sel = rangy.getSelection() 
    if (sel.rangeCount === 0 || sel.isCollapsed) return 
    alert(sel.toString()) 
}) 

Answer 4

Usa seguente codice

(function() { 
     "use strict"; 
     var showSelectedText = function (e) { 
      var text = ''; 
      if (window.getSelection) { 
       text = window.getSelection(); 
      } else if (document.getSelection) { 
       text = document.getSelection(); 
      } else if (document.selection) { 
       text = document.selection.createRange().text; 
      } 

      console.log(text.toString()); 
     } 

     document.onmouseup = showSelectedText; 
     if (!document.all) { 
      document.captureEvents(Event.MOUSEUP); 
     } 

})();