Never been to DZone Snippets before?

Snippets is a public source code repository. Easily build up your personal collection of code snippets, categorize them with tags / keywords, and share them with the world

About this user

Jonas Raoni Soares Silva http://jsfromhell.com

« Newer Snippets
Older Snippets »
Showing 1-1 of 1 total  RSS 

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>
« Newer Snippets
Older Snippets »
Showing 1-1 of 1 total  RSS