Previous Example-|-Next Example-|-Return to Chapter Listing

Example 7.18:
Assigning Function Objects to Events

[This example works with Netscape Navigator 3. It will not work with Internet Explorer 3.]

Tab to the select box and click the button (function objects have been assigned to the text box's onblur event and the onclick event of the button):

LastName: Title:

Note we haven't put the function definitions in the header as usual. This is because the functions are assigned to some form object events (i.e. the DisplayMsg button's onclick event and the txtBox's onblur event), so the definition of these functions must come after the definition of the form, otherwise we will get 'form/object not found' errors when the page loads.
Also note that because event handlers cannot take parameters (they are just strings as in object.onblur="function()"), you cannot put paramaters in function objects assigned to events.
Here's the form and the script assigning functions to the form events: <FORM NAME="Form01"> LastName: <INPUT TYPE="text" NAME="txtBox" SIZE=20> Title: <SELECT name="lstOption"> <OPTION>Mr <OPTION>Mrs <OPTION>Ms <OPTION>Miss <OPTION>Dr </SELECT> <INPUT TYPE="button" VALUE="OK" name="DisplayMsg"> </FORM> <SCRIPT LANGUAGE="JAVASCRIPT"> <!-- document.Form01.txtBox.focus() document.Form01.txtBox.onblur = new Function("alert('Select a title')") document.Form01.DisplayMsg.onclick = new Function("alert('Completed name')") //--> </SCRIPT>
Previous Example-|-Next Example-|-Return to Chapter Listing