Wie füge ich dem Webkit ein anderes Wort hinzu?

Question

Angenommen, ich habe meinen Bereich so eingestellt, dass er ein Wort abdeckt, indem range.expand('word') verwendet wird. Um das nächste Wort hinzuzufügen, würde ich normalerweise range.moveEnd('word', 1) schreiben. Aber das scheint in Webkit nicht zu funktionieren. Vielleicht sollte es anders umgesetzt werden?

Answer 1

Sie sprechen von TextRange s, die nur vollständig in IE implementiert sind. Andere Browser verwenden stattdessen die Objekte DOM Level 2 Range, die TextRanges in den meisten Fällen weit überlegen sind, aber keine äquivalenten textbasierten Methoden wie expand() haben. Neuere WebKit-Browser implementieren jedoch eine Version von expand(), und sowohl Webkit als auch Firefox 4 haben die modify()-Methode des Selection-Objekts, das ähnliche Funktionen bietet.

Beispiel: http://jsfiddle.net/bzU22/1/

<script type="text/javascript"> 
    function expandSelection() { 
     if (window.getSelection && window.getSelection().modify) { 
      var sel = window.getSelection(); 
      sel.modify("extend", "forward", "word"); 
     } else if (document.selection && document.selection.type == "Text") { 
      var range = document.selection.createRange(); 
      range.moveEnd("word", 1); 
      range.select(); 
     } 
     document.getElementById("test").focus(); 
    } 
</script> 

<input type="button" unselectable onclick="expandSelection();" value="Expand"> 
<p contenteditable="true" id="test">Hello, this is some test text. 
    Select a word and then press the 'Expand' button.</p>