Event : Event Object « Event « JavaScript Tutorial

1.	Language Basics
2.	Operators
3.	Statement
4.	Development
5.	Number Data Type
6.	String
7.	Function
8.	Global
9.	Math
10.	Form
11.	Array
12.	Date
13.	Dialogs
14.	Document
15.	Event
16.	Location
17.	Navigator
18.	Screen
19.	Window
20.	History
21.	HTML Tags
22.	Style
23.	DOM Node
24.	Drag Drop
25.	Object Oriented
26.	Regular Expressions
27.	XML
28.	GUI Components
29.	Dojo toolkit
30.	jQuery
31.	Animation
32.	MS JScript

JavaScript Tutorial » Event » Event Object

The Event object represents an event.

Properties of the Event Object is listed in the following table.

Property	Description
data	Array of URL's for dragged and dropped objects
height	Height of window
layerX	Horizontal cursor position within layer
layerY	Vertical cursor position within layer
modifiers	Bit mask representing modifier keys
pageX	Horizontal cursor position within Web page
pageY	Vertical cursor position within Web page
screenX	Horizontal cursor position within computer screen
screenY	Vertical cursor position within computer screen
target	Object for captured events
type	Type of event
which	The mouse button that is pressed
width	Width of window

In addition to the Event properties, events exist that get handled.

The available events are shown in the following Table.

Events	Description
ABORT	Loading of Web page interrupted by user.
BLUR	Focus is removed from the object.
CHANGE	Contents or setting for document object changed.
CLICK	Mouse button is clicked once.
DBLCLICK	Mouse button is clicked twice.
DRAGDROP	Object is dragged and dropped.
ERROR	Error occurred during loading.
FOCUS	Focus is applied to an object.
KEYDOWN	A key is pressed down.
KEYPRESS	A key is pressed.
KEYUP	A key is let up after being pressed down.
LOAD	Load document within a browser.
MOUSEDOWN	The mouse button is pressed down.
MOUSEMOVE	The mouse cursor is moved.
MOUSEOUT	The mouse cursor is moved away from a specific object.
MOUSEOVER	The mouse cursor is moved over a specific object.
MOUSEUP	The pressed mouse button is let up.
MOVE	Object is moved on the screen.
RESET	Reset button is pressed.
RESIZE	Window or frame has been resized.
SELECT	Document object is selected.
SUBMIT	Submit button is pressed.
UNLOAD	Document is unloaded from browser.

<html>

    <head>

    <title>Using the event object</title>

    </head>

    <body>

    <script language = "Javascript">

    <!--



    window.captureEvents(Event.KEYPRESS | Event.DBLCLICK);



    document.captureEvents(Event.SUBMIT);



    function handlePress(evnt){

       alert("You pressed a key down. The event type: " + evnt.type);

       return true;

    }



    function handleDblClick(evnt){

       alert("You double clicked at location: " + evnt.pageX + "," + evnt.pageY);

       return(true);

    }

    function handleSubmit(evnt){

       alert("You clicked on the submit button");

    }

    window.onkeypress = handlePress;



    window.ondblclick = handleDblClick;



    document.onsubmit = handleSubmit;

    -->



    </script>

    When you click on the submit button, it triggers the <b>SUBMIT</b>

    event which displays an alert box.



    <br><br>

    If you double click somewhere in the page, it triggers the

    <b>DBLCLICK</b> event.

    <br><br>

    When a key is pressed down in the browser, the <b>KEYPRESS</b>

    event is triggered.

    <br><br><br>

    <form>

    <input type="submit" value="Submit" onSubmit=''>

    </form>

    </body>

    </html>

15.1.Event Object
	15.1.1.	Event
	15.1.2.	event.data
	15.1.3.	event.height
	15.1.4.	event.layerX
	15.1.5.	event.layerY
	15.1.6.	event.pageX
	15.1.7.	event.pageY
	15.1.8.	event.screenX
	15.1.9.	event.screenY
	15.1.10.	event.target
	15.1.11.	event.type
	15.1.12.	event.which
	15.1.13.	event.width
	15.1.14.	Event.ABORT
	15.1.15.	Event.CHANGE
	15.1.16.	Add event handler to form

java2s.com | Contact Us | Privacy Policy

All other trademarks are property of their respective owners.