Review jQuery event methods by preventDefault () and jquery event binding methods

Review jQuery event methods by preventDefault () and jquery event binding methods


Today, I saw the preventDefault () method. I reviewed the jQuery event Method and wrote down the notes.
JQuery reference manual-Events

The event Method triggers an event that matches an element, or binds a function to an event of all matching elements.

Trigger instance:

$("button#demo").click()

The preceding example triggers the click Event of the button element of id = "demo.

Bound instance:

$("button#demo").click(function(){$("img").hide()})

In the preceding example, all images are hidden when you click the id = "demo" button.

Method	Description
Bind ()	Attaches one or more event processors to the Matching Element
Blur ()	Triggers or binds a function to a blur event of a specified element.
Change ()	Triggers or binds a function to a change event of a specified element.
Click ()	Triggers or binds a function to a click event of a specified element.
Dblclick ()	Trigger or bind the function to the double click Event of the specified element.
Delegate ()	Attaches one or more event processors to the current or future child elements of the matching element.
Die ()	Remove all event handlers added using the live () function.
Error ()	Trigger or bind the function to the error event of the specified element.
Event. isDefaultPrevented ()	Whether event. preventDefault () is called on the event object ().
Event. pageX	The cursor position relative to the left edge of the document.
Event. pageY	The cursor position relative to the top edge of the document.
Event. preventDefault ()	The default action to block events.
Event. result	Contains the last value returned by the event processor triggered by the specified event.
Event.tar get	The DOM element that triggers the event.
Event. timeStamp	This attribute returns the number of milliseconds from January 1, January 1, 1970 to the event occurrence.
Event. type	Describes the event type.
Event. which	Indicates which key or button is pressed.
Focus ()	Triggers or binds a function to a focus event of a specified element.
Keydown ()	Trigger or bind the function to the key down event of the specified element.
Keypress ()	Trigger or bind the function to the key press event of the specified element.
Keyup ()	Trigger or bind the function to the key up event of the specified element.
Live ()	Add one or more event processors for current or future matching elements
Load ()	Load events that trigger or bind a function to a specified Element
Mousedown ()	Trigger or bind the function to the mouse down event of the specified element.
Mouseenter ()	Trigger or bind the function to the mouse enter event of the specified Element
Mouseleave ()	Trigger or bind the function to the mouse leave event of the specified element.
Mousemove ()	Trigger or bind the function to the mouse move event of the specified element.
Mouseout ()	Trigger or bind the function to the mouse out event of the specified element.
Mouseover ()	Trigger or bind the function to the mouse over event of the specified Element
Mouseup ()	Trigger or bind the function to the mouse up event of the specified element.
One ()	Add an event processor to the matching element. Each element can only trigger this processor once.
Ready ()	Document readiness event (When HTML documents are ready for use)
Resize ()	Trigger or bind the function to the resize event of the specified element.
Scroll ()	Triggers or binds a function to a scroll event of a specified element.
Select ()	Triggers or binds a function to a select event of a specified element.
Submit ()	Triggers or binds a function to a submit event of a specified element.
Toggle ()	Bind two or more event processor functions and execute them when a rotating click event occurs.
Trigger ()	Specify events for all matching elements
TriggerHandler ()	The first specified event of the matched element
Unbind ()	Remove an added event processor from the Matching Element
Undelegate ()	Remove an added event processor from the Matching Element, now or in the future
Unload ()	Trigger or bind the function to the unload event of the specified element.

Html dom Event object instance

Which mouse button is clicked?

What is the coordinate of the cursor?

What is the unicode of the pressed key?

What is the coordinate of the cursor relative to the screen?

Is the shift key pressed?

Which element is clicked?

Which event type has occurred?

Event object

The Event object represents the Event status, such as the elements in the Event, the status of the keyboard buttons, the location of the mouse, and the status of the mouse button.

Events are usually used in combination with functions. functions are not executed before an event occurs!

Event Handlers)

One of the new features of HTML 4.0 is the ability to trigger HTML events in browsers. For example, when a user clicks an HTML element, a JavaScript code is started. The following is an attribute list that can be inserted with HTML tags to define event behavior.

Attribute	When this event occurs...
Onabort	Image loading is interrupted.
Onblur	Element loses focus.
Onchange	The domain content is changed.
Onclick	Event handle called when a user clicks an object.
Ondblclick	The event handle that is called when you double-click an object.
Onerror	An error occurred while loading the document or image.
Onfocus	Element to obtain the focus.
Onkeydown	A keyboard button is pressed.
Onkeypress	A keyboard button is pressed and released.
Onkeyup	A keyboard button is released.
Onload	A page or image is loaded.
Onmousedown	The mouse button is pressed.
Onmousemove	The mouse is moved.
Onmouseout	Move the mouse away from an element.
Onmouseover	Move the cursor over an element.
Onmouseup	The mouse button is released.
Onreset	The reset button is clicked.
Onresize	The window or frame is adjusted again.
Onselect	The text is selected.
Onsubmit	The confirmation button is clicked.
Onunload	The user exits the page.

Mouse/keyboard Properties

Attribute	Description
AltKey	Returns whether or not "ALT" is pressed when the event is triggered.
Button	Returns the mouse button that is clicked when an event is triggered.
ClientX	Returns the horizontal coordinates of the mouse pointer when an event is triggered.
ClientY	Returns the vertical coordinates of the mouse pointer when an event is triggered.
CtrlKey	Returns whether the "CTRL" Key is pressed when the event is triggered.
MetaKey	Returns whether the "meta" Key is pressed when the event is triggered.
RelatedTarget	Return the node associated with the target node of the event.
ScreenX	Returns the horizontal coordinates of the mouse pointer when an event is triggered.
ScreenY	Returns the vertical coordinates of the mouse pointer when an event is triggered.
ShiftKey	Returns whether the "SHIFT" Key is pressed when the event is triggered.

IE attributes

In addition to the above mouse/event attributes, the IE browser also supports the following attributes:

Attribute	Description
CancelBubble	If the event handle wants to prevent the event from spreading to an inclusive object, you must set this attribute to true.
FromElement	For mouseover and mouseout events, fromElement references the elements that move the mouse away.
KeyCode	For keypress events, this attribute declares the Unicode escape code generated by the hitting key. For keydown and keyup events, it specifies the virtual keyboard code of the key to be knocked. The virtual keyboard code may be related to the layout of the used keyboard.
OffsetX, offsetY	The x and y coordinates of the event occurrence location in the coordinate system of the event source element.
ReturnValue	If this attribute is set, its value has a higher priority than the return value of the event handle. Set this attribute to fasle to cancel the default action of the event source element.
SrcElement	References to the Window object, Document object, or Element object that generates the event.
ToElement	For mouseover and mouseout events, this attribute references the elements that move into the mouse.
X, y	The x and y coordinates of the event location, which are relative to the inmost element dynamically located with CSS.

Standard Event attributes

The attributes defined by Level 2 DOM events are listed below.

Attribute	Description
Bubbles	Returns a Boolean value indicating whether the event is a bubble event type.
Cancelable	Returns a Boolean value indicating whether the event can hold the default action that can be canceled.
CurrentTarget	Returns the event listener element that triggers the event.
EventPhase	Returns the current stage of event propagation.
Target	Returns the element that triggers the event (the target node of the event ).
TimeStamp	Returns the date and time of event generation.
Type	Returns the name of the Event represented by the current Event object.

Standard Event Method

The following describes the standard definition of level 2 DOM events. The event model of IE does not support these methods:

Method	Description
InitEvent ()	Initialize the attributes of the newly created Event object.
PreventDefault ()	Notify the browser not to perform the default action associated with the event.
StopPropagation ()	No longer distribute events.

Copyright Disclaimer: This article is an original article by the blogger and cannot be reproduced without the permission of the blogger.