spacer
Yehuda Shiran August 10, 2000
Implementing Read-Only Fields
Tips: August 2000

Yehuda Shiran, Ph.D.
Doc JavaScript

Developer News
News Flash: Adobe Has iPhone Workaround
Adobe's Flash 10.1 Goes Mobile (Minus iPhone)
A Salute to Visionary CEOs

A blur event occurs when a text field loses focus. A field gains focus when the user clicks inside the text box, and the focus is lost when the user clicks outside the box, anywhere on the page. You can explicitly blur a text object using the object's blur() method, which removes focus from the field. This method deselects any text that might be selected in the field and removes the text insertion point from the field. At this point, no fields or form elements are focused. A manual way to blur a text object is to hit Tab, which advances focus to the next field in order and removes it from the current field (blurring it). However, the JavaScript blur() method only removes focus from its object, without giving focus to any other field in the form or in the page.

A read-only text field is a classic example for using the blur() method. The algorithm to create such a field is very simple. When the user explicitly gives focus to a field in order to write in it, an event handler (onFocus) invokes the blur() method to instantly remove the focus. Here is a read-only text field example:

Here is the script that implements the field entry:

<FORM>
<INPUT TYPE="text" NAME="myField" VALUE="Have you checked docjs.com?" onFocus="this.blur()" SIZE="40">
</FORM>


People who read this tip also read these tips:

Look for similar tips by subject:

internet.commediabistro.comJusttechjobs.comGraphics.com

Search:

WebMediaBrands Corporate Info

Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Building a Banking Application Home Page with OOP · Mixing Scripting Languages · Review: phpFox, a Social Networking CMS with all the Bells and Whistles
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Enterprise 2.0: Social Networking in the Cloud · BroadSoft Marketplace Hastens Pace of Telephony Innovation · Review: HTC Hero for Sprint