2012-03-31 13 views
12

Ok, ho cercato in tutto il Web per trovare una soluzione ma non sono riuscita a trovarne una, c'è un modo per ottenere la parola prima della posizione del cursore in un div editabile così un po ' come:JavaScript parola prima del cursore

This is some| demo texts 

Ciò dovrebbe restituire la parola "alcuni" ... non so se questo è possibile, sarei felice per qualsiasi aiuto, grazie :).

+0

Avete requisiti del browser? Le persone vorranno anche sapere se jquery è ok. – Hemlock

+0

sì, usa tutte le lingue web che vuoi, preferibilmente tutti i browser ma principalmente Firefox :) –

risposta

18

Con l'utilizzo del metodo di ricerca posizione Caret fornito here ciò farà ciò che si desidera.

function GetCaretPosition(ctrl) { 
     var CaretPos = 0; // IE Support 
     if (document.selection) { 
      ctrl.focus(); 
      var Sel = document.selection.createRange(); 
      Sel.moveStart('character', -ctrl.value.length); 
      CaretPos = Sel.text.length; 
     } 
     // Firefox support 
     else if (ctrl.selectionStart || ctrl.selectionStart == '0') 
      CaretPos = ctrl.selectionStart; 
     return (CaretPos); 
    } 

    function getWordAtPos(s, pos) { 
     var preText = s.substring(0, pos); 
     if (preText.indexOf(" ") > 0 || preText.indexOf("\n") > 0) { 
      var words = preText.split(" "); 
      words = words[words.length - 1].split("\n"); 
      return words[words.length - 1]; //return last word 
     } 
     else { 
      return preText; 
     } 
    } 

    function AlertPrevWord() { 
     var text = document.getElementById("textArea"); 
     var caretPos = GetCaretPosition(text) 
     var word = ReturnWord(text.value, caretPos); 
     if (word != null) { 
      alert(word); 
     } 
    } 

Attuazione

<input id="textArea" type="text" /> 
<br /> 
<input id="Submit" type="submit" value="Test" onclick="AlertPrevWord()" /> 

http://jsfiddle.net/arrwP/2/

+0

Potrebbe fare un jsfiddle? Perché non so come implementarlo in una textarea ... –

+0

'textarea' o editable' div'? – Hemlock

+0

Con '|' l'OP indicava la posizione del cursore, non il carattere attuale della linea verticale presente nella stringa sorgente. –

9

Qui è un metodo grezzo utilizzando i Selection e Range oggetti.

function getWord() { 
    var range = window.getSelection().getRangeAt(0); 
    if (range.collapsed) { 
     text = range.startContainer.textContent.substring(0, range.startOffset+1); 
     return text.split(/\b/g).pop(); 
    } 
    return ''; 
} 

È possibile vederlo in azione qui: http://jsfiddle.net/ggfFw/1/. Questo non funzionerà in IE. Se hai bisogno del supporto IE guarda la libreria di Rangy.

+0

Come si può ottenere che funzioni su un '