JavaScript Event Handlers
<html>
<head>
<script language="JavaScript">
<!--
var noticeWindow
//onClick event handler
function displayHat() {
hatWindow = window.open("http://www.java2s.com","ViewHat" ,"toolbar=0,width=200,height=400,resizable=0");
}
//onSubmit event handler
function confirmOrder() {
return confirm('on submit');
}
//onChange event handler
function convertToUppercase(fieldObject) {
fieldObject.value = fieldObject.value.toUpperCase();
}
// onFocus event handler
function selectContents(fieldObject) {
fieldObject.select();
}
// onMouseOver event handler
function updateStatusBar() {
window.status = 'mouse over';
return true
}
// onMouseOut event handler
function updateStatusBarOut() {
window.status = '';
return true
}
// onSelect event handler
function accessText() {
alert('Success');
}
// -->
</script>
</head>
<body>
<a href="http://www.java2s.com"
name="linker"
onMouseOver="return updateStatusBar()"
onMouseOut="return updateStatusBarOut()">www.java2s.com</a>
</p>
<form method="POST">
<input type=button name="ViewHat" value="View Hat" onClick=displayHat()></p>
</form>
<hr>
<form action="JavaScript:alert('order')"
method="POST"
name="MainForm"
onSubmit="return confirmOrder()">
<h2>Customer Information</h2>
<pre> First Name:
<input type=text size=20 maxlength=20 name="FirstName" onFocus="selectContents(this)">
Last Name:
<input type=text size=20 maxlength=20 name="LastName" onFocus="selectContents(this)">
Title:
<input type=text size=30 maxlength=30 name="Title" onFocus="selectContents(this)">
Company:
<input type=text size=30 maxlength=30 name="Company" onFocus="selectContents(this)">
Street Address:
<input type=text size=30 maxlength=30 name="StreetAddr" onFocus="selectContents(this)">
City:
<input type=text size=30 maxlength=30 name="City" onFocus="selectContents(this)">State:
<input type=text size=3 maxlength=2 name="State" onFocus="selectContents(this)" onChange="convertToUppercase(this)">
Zip Code:
<input type=text size=30 maxlength=10 name="ZipCode" onFocus="selectContents(this)">
Telephone:
<input type=text size=12 maxlength=12 name="Phone" onFocus="selectContents(this)">
FAX:
<input type=text size=12 maxlength=12 name="FAX" onFocus="selectContents(this)">
Email:
<input size=30 maxlength=50 name="Email" onFocus="selectContents(this)">
URL:
<input type=text size=30 maxlength=100 name="URL" onFocus="selectContents(this)"></pre>
<hr>
<blockquote>
<p><textarea name="worthyBox" rows=3 cols=49 onFocus="selectContents(this)">
</textarea></blockquote></p>
<p><input type=submit value="Order" onClick="confirmOrder('Submit object')">
<input type=reset value="Clear Form" onClick="alert('Clearing!')"></p>
</form>
<a href="JavaScript:displayHat()"><img src="http://www.java2s.com/style/logo.png" align=bottom border=0 width=50 height=50>
</a>
</body>
</html>
Related examples in the same category