273Chapter 15Generic HTML Element (Web host sites) Objectscompatible with other browsers)
273Chapter 15Generic HTML Element Objectscompatible with other browsers) by initiating the focus and selection actions through asetTimeout()method. See Chapter 43 on the CD-ROM on data validation for an example. A common design requirement is to position the insertion pointer at the end of a text field ortextareaso that a user can begin appending text to existing content immediately. This ispossible in IE4+ with the help of the TextRangeobject. The following script fragment movesthe text insertion pointer to the end of a textareaelement whose ID is myTextarea: var range = document.getElementById( myTextarea ).createTextRange(); range.move( textedit ); range.select(); You should be very careful in combining blur()or focus()methods with onblurand onfocusevent handlers especially if the event handlers display alert boxes. Many combi- nations of these events and methods can cause an infinite loop in which it is impossible todismiss the alert dialog box completely. On the other hand, there is a useful combination forolder browsers that don t offer a disabledproperty for text boxes. The following text fieldevent handler can prevent users from entering text in a text field: onfocus = this.blur() ; Some operating systems and browsers enable you to give focus to elements such as buttons(including radio and checkbox buttons) and hypertext links (encompassing both aand areaelements). Typically, once such an element has focus, you can accomplish the equivalent of amouse click on the element by pressing the spacebar on the keyboard. This is helpful foraccessibility to those who have difficulty using a mouse. An unfortunate side effect of button focus in Win32 environments is that the focus highlight(a dotted rectangle) remains around the button after a user clicks it and until another objectgets focus. You can eliminate this artifact for browsers and objects that implement theonmouseupevent handler by including the following event handler in your buttons: onmouseup = this.blur() ; IE5.5+ recognizes the often undesirable effect of that dotted rectangle and lets scripts set thehideFocusproperty of an element to trueto keep that rectangle hidden while still giving theelement focus. It is a trade-off for the user, however, because there is no visual feedbackabout which element has focus. Other elementsFor other kinds of elements that support the focus()method, you can bring an element intoview in lieu of the scrollIntoView()method. Link (a) and areaelements in Windows ver- sions of IE display the dotted rectangle around them after a user brings focus to them. Toeliminate that artifact, use the sameonmouseup = this.blur() ; event handler (or IE5.5+ hideFocusproperty) as just described for form controls. ExampleListing 15-23 contains an example of using the focus()and blur()methods to tinker withchanging the focus of windows. This example creates a two-window environment; from eachwindow, you can bring the other window to the front. The main window uses the objectreturned by window.open()to assemble the reference to the new window. In the subwindow(whose content is created entirely on the fly by JavaScript), self.openeris summoned torefer to the original window, while self.blur()operates on the subwindow itself. Blurringone window and focusing on another window yields the same result of sending the window tothe back of the pile. elementObject.blur()