JavaScript » eventhandler » onChange

onChange = myJavaScriptCode

Event handler for FileUpload, Select, Text, TextArea.

The onChange event handler executes the specified JavaScript code or function on the occurance of a change event. This is when the data in one of the above form elements is altered by the user. This is used frequently to validate the data that has been entered by the user by calling a specified JavaScript function.

The onChange event handler uses the following Event object properties.

type - this property indicates the type of event.
target - this property indicates the object to which the event was originally sent.


<INPUT TYPE="text" VALUE="Enter email address" NAME="userEmail" onChange=validateInput(this.value)>

<script type="text/javascript" language="JavaScript">


function validateInput() {
userInput = new String()
userInput = this.myForm.userEmail.value
 if (userInput.match("@"))
    alert("Thanks for your interest.")
    alert("Please check your email details are correct before submitting")


This example shows the use of the onChange event handler to call a JavaScript function that validates the data input by the user (in this case, the function simply checks wether the entered email address contains the '@' character and displays a relevant message). Note that the first line is HTML code and assumes that the text box is on a form called 'myForm'.

See Also: