Summary of jquery Events

Blur ()
Triggers or binds the blur event.
$ ("input"). blur (function () {
$ ("input"). CSS ("Background-color", "#D6D6FF");
});

Change ()
Triggers or binds a change event, which applies only to text fields (textbox), and to textarea and select elements.
$ (". Field"). Change (function () {
$ (this). CSS ("Background-color", "#FFFFCC");
});

Click ()
Triggers or binds the Click event.
$ ("button"). Click (function () {
$ ("P"). Slidetoggle ();
});

DblClick ()
Triggers or binds the DblClick event.

error ()
The error event occurs when an error event is triggered or bound, and when an element encounters a fault (not loaded correctly).
$ ("img"). Error (function () {
$ ("img"). ReplaceWith ("Missing image!");
});

Focus ()
Trigger or bind a focus event, which receives focus when the element is clicked by a mouse click or the TAB key is positioned.
$ ("input"). focus (function () {
$ ("input"). CSS ("Background-color", "#FFFFCC");
});

Resize ()
Triggers or binds the Resize event, which occurs when the size of the browser window is resized. Resize event.

Scroll ()
Triggers or binds the scroll event, which occurs when the user scrolls the specified element.
The Scroll event applies to all scrollable elements and window objects (browser windows).

Select ()
The Select event occurs when the text in the input element of the textarea or text type is selected, triggering or binding a select event.
$ ("input"). Select (function () {
$ ("input"). After ("Text marked!");
});

Submit ()
Triggers or binds a submit event, which occurs when a form is submitted. This event applies only to form elements.
$ (selector). Submit ()

KeyDown () triggers or binds the KeyDown event of the specified element
keypress () triggers or binds the KeyPress event of the specified element
KeyUp () triggers or binds the KeyUp event of the specified element
The KeyDown event occurs when the button is pressed, the KeyUp event occurs when the button is released, the key is pressed and released, and the KeyPress event occurs.
$ ("input"). KeyDown (function () {
$ ("input"). CSS ("Background-color", "#FFFFCC");
});

Load ()
The Load event occurs when the specified element (and child element) is loaded, and applies to any element with a URL (a comparison, script, framework, inline frame).
Depending on the browser (Firefox and IE), the Load event may not be triggered if the image has been cached.
$ ("img"). Load (function () {
$ ("div"). Text ("Image Loaded");
});

Unload ()
The Unload event occurs when the user leaves the page, including the following scenarios:
Click on a link to leave the page, type a new URL in the address bar, use the forward or backward button, close the browser, reload the page
The Unload () method applies only to the Window object.
$ (window). Unload (function () {
Alert ("goodbye!");
});
$ ("P"). Click (function (e) {
$ ("P"). Animate ({fontSize: "+=5px"});
$ (this). Unbind (e);
});

MouseDown () MouseDown event that triggers or binds a function to a specified element
MouseEnter () MouseEnter event that triggers or binds a function to a specified element
MouseLeave () MouseLeave event that triggers or binds a function to a specified element
MouseMove () MouseMove event that triggers or binds a function to a specified element
Mouseout () Mouseout event that triggers or binds a function to a specified element
MouseOver () MouseOver event that triggers or binds a function to a specified element
MouseUp () MouseUp event that triggers or binds a function to a specified element
$ ("button"). MouseDown (function () {
$ ("P"). Slidetoggle ();
});

Ready ()
Specifies the code that executes when the ready event occurs.
The Ready event occurs when the DOM (Document Object model) has been loaded and the page (including the image) has been fully rendered.
Because the event occurs after the document is ready, it is good practice to place all other jQuery events and functions in the event.
The Ready () function is available only for the current document, so there is no need to select a selector.
The following three types of syntax are allowed:
$ (document). Ready (function)
$ (). Ready (function)
$ (function)

Toggle ()
Used to bind two or more event handler functions in response to a rotating click event of the selected element.
$ ("P"). Toggle (
function () {
$ ("Body"). CSS ("Background-color", "green");},
function () {
$ ("Body"). CSS ("Background-color", "Red");},
function () {
$ ("Body"). CSS ("Background-color", "Yellow");}
);

Trigger ()
The specified event type that triggers the selected element.
$ ("button"). Click (function () {
$ ("input"). Trigger ("select");
});

Triggerhandler ()

The specified event type that triggers the selected element. However, the browser default action is not performed and event bubbling does not occur.
The Triggerhandler () method is similar to the trigger () method. The difference is that it does not trigger the default behavior of events (such as form submissions), and only affects the first matching element.
Differences compared to the trigger () method:
It does not cause the default behavior of events (such as form submissions)
. Trigger () will manipulate all the elements that the JQuery object matches, whereas. Triggerhandler () affects only the first matching element.
Events created by. Triggerhandler () do not bubble in the DOM tree, and nothing happens if the target element does not process them directly.
The method returns the return value of the event handler instead of the JQuery object, which has a chain of functionality. In addition, if no handlers are fired, this method returns undefined.
$ ("button"). Click (function () {
$ ("input"). Triggerhandler ("select");
});

bind ()
Adds one or more event handlers for the selected element, and specifies the function to run when the event occurs.
$ ("button"). Bind ("click", Function () {
$ ("P"). Slidetoggle ();
});

unbind ()
Removes the event handler for the selected element.
This method can remove all or the selected event handlers, or terminate the operation of the specified function when the event occurs.
Unbind () for any event handlers and functions that are attached to an event handler by jquery, unbinding the element
If no parameters are specified, the Unbind () method removes all event handlers for the specified element.
$ ("button"). Click (function () {
$ ("P"). Unbind ();
});

Live ()
Attaches one or more event handlers to the selected element, and specifies the function to run when these events occur.
The event handlers attached through the live () method apply to the current and future elements of the matching selector (such as new elements created by the script).
$ ("button"). Live ("Click", Function () {
$ ("P"). Slidetoggle ();
});

Die ()
Removes all one or more event handlers added to the specified element through the live () method.
$ ("P"). Die ();

One ()
Attaches one or more event handlers to the selected element, and specifies the function to run when the event occurs.
When using the one () method, the event handler function can only be run once per element.
$ ("P"). One ("click", Function () {
$ (this). Animate ({fontSize: "+=6px"});
});

Preventdefault ()
Prevents the default behavior of an element (for example, when a Submit button is clicked to block the submission of the form).
$ ("a"). Click (Function (event) {
Event.preventdefault ();
});

event property:

Result Property
Contains the last value returned by the event handler that is triggered by the specified event, unless the value is undefined.
$ ("button"). Click (function (e) {
$ ("P"). html (E.result);
});

Target Property
Specifies which DOM element triggers the event.
$ ("p, button, H1, H2"). Click (Function (event) {
$ ("div"). html ("triggered by a" + Event.target.nodeName + "element.");
});

TimeStamp Property
Contains the number of milliseconds from January 1, 1970 to the time the event was triggered.
$ ("button"). Click (Function (event) {
$ ("span") HTML (event.timestamp);
});

Type property
Describes what type of event is triggered.
$ ("P"). Bind (' Click DblClick mouseover mouseout ', function (event) {
$ ("div"). html ("Event:" + event.type);
});

which property
Indicates which key or button was pressed.
$ ("input"). KeyDown (function (event) {
$ ("div"). html ("Key:" + Event.which);
});

PageX () property
The position of the mouse pointer relative to the left edge of the document.
Pagey () property
The position of the mouse pointer relative to the top edge of the document.
$ (document). MouseMove (function (e) {
$ ("span"). Text ("X:" + E.pagex + ", Y:" + e.pagey);
});

Summary of jquery Events