EVENT:  onblur
onblur="action"
 
The onblurs event occurs when the element that is in focus, loses that focus. You use the term, in blur, to signify that an element does not have focus. Since only one element can be in focus at one time, all other elements are in blur.
 
By focus, we mean that the cursor is at that element. For example, if the element was an input text box in a form, the cursor would appear inside the element and you could type and enter data into the box.
 
These six events are useful when dealing with forms and form elements:
 
  • onblur - runs a script when the element loses focus.
  • onchange - runs a script when the element changes.
  • onfocus - runs a script when the element gets the focus.
  • onreset - runs a script when the form is reset.
  • onselect - runs a script when the element is selected.
  • onsubmit- runs a script when the form is submitted.

    •  
    In this example, alert messages advise which element is in focus and which has lost focus.
     
    Code:
    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="eng">
    <head>
    <title>DevGuru XHTML onfocus and onblur Example</title>
    </head>
    <body>
    <form>
    Click back and forth between input text windows One and Two.
    <br />
    Alert messages will state who is in focus and who has lost focus (become blur).
    <br />

    One:
    <input onfocus="JavaScript:alert('One is in focus')"
    onblur="JavaScript:alert('One has lost focus')" />
    <br />

    Two:
    <input onfocus="JavaScript:alert('Two is in focus')"
    onblur="JavaScript:alert('Two has lost focus')" />

    </form>
    </body>
    </html>
     
    Output:
    Click to view and test form in separate window

    Copyright 1999-2001 by Infinite Software Solutions, Inc. All rights reserved.
    Trademark Information