2013-07-16 18 views
15

Chcę zaznaczyć tekst wysyłając Lokalizacja/anchorOffset i długość/offsetu za pomocą JavaScript Oto mój kodSet wybór przez zakres w JavaScript

var node = document.getElementById("content"); 
    var range = document.createRange(); 
    range.setStart(node, 0); 
    range.setEnd(node, 4); // here 0 and 4 is my location and length for the selection 
     // if my string is "This is test string" in my case its must select "This" 
    var selection = window.getSelection(); 
    selection.removeAllRanges(); 
    selection.addRange(range); 

Ale problem jest z range.setStart i range.setEnd jej nie działa jak oczekuję

+0

@AndyG Używam go w mojej aplikacji na IOS. Funkcja przywracania działa poprawnie, ale problem jest tylko z setStart i setEnd oba nie działają –

+1

@AndyG: Wrong way round. 'document.createRange()' jest standardem, obsługiwanym przez wszystko oprócz IE <= 8. –

+0

Dziękuję @TimDown. Patrzyłem na 'selection.createRange'. –

Odpowiedz

12

w setStart() i setEnd() metody DOM zakres są dobrze określone, więc można znaleźć odpowiedź czytając the spec lub MDN.

Podsumowując, jeśli chcesz określić granicę zakresu w postaci przesunięć znaków, musisz zająć się węzłem tekstowym, a nie elementem. Jeśli element zawiera pojedynczy węzeł tekstowy, zmieniając pierwszą linię kodu do następujących będzie działać:

var node = document.getElementById("content").firstChild; 
+0

Świetnie działa w przypadku, gdy mam tylko jedną linię tekstu w "treści". Co się stanie, jeśli zastosuję pogrubienie lub znacznik czcionki w ciągu znaków? –

+1

@ShinningRiver: Będziesz potrzebować bardziej skomplikowanego rozwiązania, takiego jak http://stackoverflow.com/a/13950376/96100 –

8

Tutaj jest dobrym rozwiązaniem, jeśli starasz się wybrać wynik jquery ustawić

var $newSelection = $('.someElements'); 
var selection = window.getSelection(); 
var range = document.createRange(); 
range.setStartBefore($newSelection.first()[0]); 
range.setEndAfter($newSelection.last()[0]); 
selection.removeAllRanges(); 
selection.addRange(range); 
Powiązane problemy