Selection //JavaScript Class
Retrieves and sets the cursor position, as well the selected text of inputs and textareas. After searching, I saw it's the only code which retrieves right information in textareas under Internet Explorer without damaging the "Ctrl+Z"
[UPDATED CODE AND HELP CAN BE FOUND HERE]
1 2 //+ Jonas Raoni Soares Silva 3 //@ http://jsfromhell.com/forms/selection [v1.0] 4 5 Selection = function(input){ 6 this.isTA = (this.input = input).nodeName.toLowerCase() == "textarea"; 7 }; 8 with({o: Selection.prototype}){ 9 o.setCaret = function(start, end){ 10 var o = this.input; 11 if(Selection.isStandard) 12 o.setSelectionRange(start, end); 13 else if(Selection.isSupported){ 14 var t = this.input.createTextRange(); 15 end -= start + o.value.slice(start + 1, end).split("\n").length - 1; 16 start -= o.value.slice(0, start).split("\n").length - 1; 17 t.move("character", start), t.moveEnd("character", end), t.select(); 18 } 19 }; 20 o.getCaret = function(){ 21 var o = this.input, d = document; 22 if(Selection.isStandard) 23 return {start: o.selectionStart, end: o.selectionEnd}; 24 else if(Selection.isSupported){ 25 var s = (this.input.focus(), d.selection.createRange()), r, start, end, value; 26 if(s.parentElement() != o) 27 return {start: 0, end: 0}; 28 if(this.isTA ? (r = s.duplicate()).moveToElementText(o) : r = o.createTextRange(), !this.isTA) 29 return r.setEndPoint("EndToStart", s), {start: r.text.length, end: r.text.length + s.text.length}; 30 for(var $ = "[###]"; (value = o.value).indexOf($) + 1; $ += $); 31 r.setEndPoint("StartToEnd", s), r.text = $ + r.text, end = o.value.indexOf($); 32 s.text = $, start = o.value.indexOf($); 33 if(d.execCommand && d.queryCommandSupported("Undo")) 34 for(r = 3; --r; d.execCommand("Undo")); 35 return o.value = value, this.setCaret(start, end), {start: start, end: end}; 36 } 37 return {start: 0, end: 0}; 38 }; 39 o.getText = function(){ 40 var o = this.getCaret(); 41 return this.input.value.slice(o.start, o.end); 42 }; 43 o.setText = function(text){ 44 var o = this.getCaret(), i = this.input, s = i.value; 45 i.value = s.slice(0, o.start) + text + s.slice(o.end); 46 this.setCaret(o.start += text.length, o.start); 47 }; 48 new function(){ 49 var d = document, o = d.createElement("input"), s = Selection; 50 s.isStandard = "selectionStart" in o; 51 s.isSupported = s.isStandard || (o = d.selection) && !!o.createRange(); 52 }; 53 }
Example
1 2 <form id="form"> 3 <fieldset> 4 <legend>Selection Test</legend> 5 <textarea name="text" rows="10" cols="30"> 6 www.jsfromhell.com 7 Jonas Carlos Lalala 8 Bin Laden x Bush 9 </textarea><br /> 10 <input name="getText" type="button" value="[Get selected text]" /> 11 <input name="getSel" type="button" value="[Get cursor]" /> 12 <br /><input name="setText" type="button" value="[Set selected text]" /> 13 <input name="setSel" type="button" value="[Set cursor]" /> 14 </fieldset> 15 </form> 16 17 <script type="text/javascript"> 18 var f = document.forms.form; 19 var selection = new Selection(f.text); 20 21 f.getText.onclick = function(){ 22 alert(selection.getText()); 23 f.text.focus(); 24 }; 25 f.setText.onclick = function(){ 26 var s = prompt("New text:", selection.getText()); 27 s !== null && selection.setText(s); 28 f.text.focus(); 29 }; 30 f.getSel.onclick = function(){ 31 var s = selection.getCaret(); 32 alert("Start: " + s.start + "\nEnd: " + s.end); 33 f.text.focus(); 34 }; 35 f.setSel.onclick = function(){ 36 var s = selection.getCaret(); 37 selection.setCaret(+prompt("Start:", s.start) || 0, +prompt("End:", s.end) || 0); 38 f.text.focus(); 39 }; 40 </script>
