Latest TweetsVerify any search engine or visitor via CLI Forward-Reverse Lookup perishablepress.com/cli-forwar…
Perishable Press

Quick JavaScript Tip: Auto-Highlight Form Inputs and Textareas

I realize that probably everybody already knows this elementary and absolutely dead-simple JavaScript tip, but I was surfing around the other day and encountered a page that made great use of some auto-highlighted textarea content. The idea is simple, include a snippet of JavaScript to enable users to automatically highlight/select upon focus any chunk of text located within a form input or textarea element.

textarea example

<textarea readonly="true" cols="33" rows="11" onmouseover="javascript:this.focus();this.select();">

   This text will be automagically highlighted upon focus..

</textarea>

form input example

<input length="77" value="This text will be highlighted upon focus.." onmouseover="javascript:this.focus();this.select();" />

I would imagine this trick works with just about any element — buttons, links, you name it. With the following code in place, content within a textarea will be highlighted/selected when the user hovers over or focuses the area. And for input elements, text will be highlighted if present, and, if not, a blinking cursor will appear, ready to serve. Very nice ;)

Jeff Starr
About the Author Jeff Starr = Creative thinker. Passionate about free and open Web.
Archives
One response
  1. Anant Mohan Verma May 11, 2010 @ 9:59 am

    This is very useful information for me and for others users. I would like appreciate it.

    Thanks for the nice sharing.

[ Comments are closed for this post ]