This section provides a quick description of event trigger attributes on different HTML tags and the 'event' object representing the event with detail information about the event. A tutorial example is provided to display mouse location by adding a listener to the mouse-pushed-down event.
IE browser also supports special HTML attributes to let you add event listeners and passing event objects.
Here are few commonly used HTML attributes on various HTML tags:
"<body onLoad="listener_code" ...>" - The specified listener code will be executed when the "onLoad" event
is triggered by the browser starting to load the HTML document.
"<body onMouseDown="listener_code" ...>" - The specified listener code will be executed
when the "onMouseDown" event is triggered by the user pushing down the mouse button anywhere in the browser window.
"<a onMouseOver="listener_code" ...>" - The specified listener code will be executed
when the "onMouseOver" event is triggered by the user moving mouse over this hyper link.
"<input type="button" onClick="listener_code" ...>" - The specified listener code will be executed
when the "onClick" event is triggered by the user clicking this button.
More event trigger attributes will be introduced in other chapters in this book.
To illustrate some nice features of event triggers, I wrote this VBScript tutorial example:
<html>
<!-- Event_Listener_and_Trigger.html
- Copyright (c) 2015, HerongYang.com, All Rights Reserved.
-->
<head>
<title>Event Listener and Trigger</title>
<script type="text/vbscript">
function mouseDown()
window.alert("Mouse pushed down!")
end function
</script>
</head>
<body onMouseDown="mouseDown()" language="vbscript">
<p>Click anywhere on the page to see a message.</p>
</body>
</html>
In this tutorial example, the "onMouseDown" event trigger attribute on the "body" tag
is used to add a short listener code to be executed when the user push down the mouse button
on the page.
A message is reported back to the user with an alert box by calling the "alert()" method
on the "window" object. See the picture below:
