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. 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 ;)
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();" />
Related articles
- Auto Clear and Restore Form Elements
- Auto-Focus Form Elements with JavaScript
- Conditionally Load WordPress Pages
- Industrial-Strength Spamless Email Links
- Maximum and Minimum Height and Width in Internet Explorer
- Go Back via JavaScript and PHP
- CSS Throwdown: Preload Images without JavaScript
About this article
This is article #458, posted by Perishable on Monday, December 10, 2007 @ 09:25pm. Categorized as Function, and tagged with forms, javascript, tips, tricks. Updated on December 10, 2007. Visited 10598 times. 0 Responses »
Bookmark • Trackback • Comment • Subscribe • Explore
« A Dramatic Week Here at Perishable Press.. • Up • More Server Mayhem »