JQuery page load event
When the DOM is loaded in place can query and manipulate bind a function to perform, this is the most important events in the module of a function, because it can greatly
To improve the response speed of the web application, in a nutshell, this method is purely to the window. The load register events alternative, through
Using this method, can be in the DOM to load in order to be able to read and manipulate immediately call you bind function, while 99.99% of JavaScript function
Need at the moment, note: can be unlimited times on the same page using the $(document) ready () event, one of the registration function will
According to the order (in code) in sequence,
Example: $(document). Ready (function () {
//code...
});
Shorthand: $(function () {
//code...
});

JQuery mouse events
JQuery mouse click event of the event triggered when the mouse click on the specified object event
Click ([[data], fn]) : parameters: fn in the matched element bindings in the click event handler, can be introduced into the data for functions with
Example: $(element). Click (function () {
Alert (" click ");
});
JQuery dblclick event of mouse events, mouse click when the specified object trigger events
Dblclick ([[data], fn]) : as parameters, and click
Example: $(element). The dblclick (function () {
Alert (" dblclick ");
});
JQuery mouse events of the mousedown event, mouse element at the specified position when press the trigger event
Example: $(element). The mousedown (function () {
Alert (" mousedown ");
});
JQuery mouseup event of mouse events, the mouse element at the specified position loosen event triggered when
Example: $(element). Mouseup (function () {
Alert (" mouseup ");
});
JQuery mouseover event of mouse events, trigger events when moving the mouse pointer specified element
Example: $(element). Mouseover (function () {
Alert (" mouseover ");
});
JQuery mouseout event of mouse events, when the mouse pointer out of the specified element trigger events
Example: $(element). Mouseout (function () {
Alert (" mouseout ");
});
JQuery mouse mouseenter of events, like mouseenter events
Example: $(element). Mouseenter (function () {
Alert (" mouseenter ");
});
JQuery mouseleave event of mouse events, like mouseleave event
Example: $(element). Mouseleave (function () {
Alert (" mouseleave ");
});
Note: the difference between the mouseover and mouseenter:
Mouseover: whether the mouse pointer across the selected element or its elements, will trigger a mouseover event
Mouseenter: only when the mouse pointer across the selected element, will trigger mouseenter
The difference between the mouseout and mouseleave:
Mouseout: no matter the mouse pointer to leave is optional element or any child elements, will trigger the mouseout event,
Mouseleave: only when the mouse pointer to leave is optional element, will trigger mouseleave event,
JQuery's hover events
Hover over,] out)
A mimic hover events (the mouse moves to one object above and remove this object) method, it is a custom method, it is
For frequent use of task provides a "hold in" state, when the mouse moves to one of the matched elements above, will trigger
Specify the first function, when the mouse moves out the elements, will trigger the second function of the specified, and will be accompanied by whether the mouse
Still testing in a particular element (for example, the image in a div), if it is, will continue to "hover" state, while
Don't trigger out events (revised using a common mistake of mouseout event),

Parameters: over, out
Over: school official cites use the mouse to move to an element to trigger function
Remove elements to trigger out: the mouse function
Example: $(element). Hover (
The function () {//hover the first function: when the mouse moved to trigger
$(this). AddClass (" changeColor ");//add a class
},
The function () {//hover the second function: when the mouse out of the triggering event
$(this). RemoveClass (" changeColor ");//remove
});

JQuery form events
Form the change of events
//input label change event, the change in the value of the input box is triggered when the event
$(" input "). The change (function (event) {
The console. The log (event);//event: the event object
});
//select label change event, the drop-down selection box, when users choose to trigger events
$(" select "). The change (function (event) {
The console. The log (event);//event: the event object
});
//textarea label change event, the change in the value of the text field is triggered when the event
$(" textarea "). The change (function (event) {
The console. The log (event);//event: the event object
});

The form of the select events
When the textarea (text field) or input (text input box type) when the text is selected, the select event will happen, this function will
Calls to bind to select all the functions of events, including the default behavior of the browser, can pass in a binding function returns false
To prevent triggering the browser's default behavior,
Example: $(" input "). The select (function () {
The console. The log (123);
});

The form of the submit events
Submission form is one of the most common business requirements, such as user registration, some of the information input is need a form submission, sometimes the same
Developers need to be at the time of form submission to filter some data, do some necessary operations (for example, to prove the validity of the form input, if
Error prevents submitted, from the new input) can submit event at this time, listening form is submitted under this action, is very simple to use,
Consistent with the basic event argument processing

Note: the form elements are the behavior of the form is submitted by default, if through the submit process, need to ban the default behavior of the browser
For example: & lt; The form onsubmit="return false;"> , can be directly in the function of jQuery return false to
Example: $(" form "). Submit (function () {
//write code verification form...
//return false.//stop the form submission
});

JQuery event object
Event. Type: obtain the event type (trigger element event type)
Example: $(element). Click (function (event) {
Alert (event. Type);//"click" event
});
Event. The pageX and event. PageY: to obtain the coordinates of the mouse relative to the current page
Through these two properties, we can determine the coordinate values of elements in the current page, the mouse position relative to the left edge of the document (left) and (top side)
Distance, simply starts from the left upper corner of the page, which is based on the page reference points, not with the slider move and change
Event. The preventDefault () methods: stop the default behavior
After the execution of this method, if you click on a link (a tag), the browser will not jump to the new URL, we can use the
Event. IsDefaultPrevented () to determine whether this method () on that event object is called a
Event. StopPropagation () method: stop event bubbling
Events can be bubbling, in order to prevent the event bubbling into the DOM tree, that is, does not trigger any predecessors elements on the event handler
Event. Which, when the mouse click, click the mouse button which
Event, which will be the event. The keyCode and event. CharCode standardization, normalization of event, which will also be the button press
(mousedown and mouseupevents), click report 1, intermediate key report 2, right-click the report 3
Event. The currentTarget: in the event bubbling in the process of the current DOM element
Bubble before the current triggers the DOM object, is equal to this
The difference between this and the event target:
Events will be bubbling in js, so this can be change, but the event. The target will not change, it is always directly accept event orders,
The DOM element
This and the event target is dom object
If you want to use the jquey method can convert them to the jquery object, such as the use of this and $(this), the event. The target
And $(event. Target) using

JQuery keyboard events
JQuery keyboard events keydown () and keyup event
Keydown () event: when the keyboard or the button is pressed, the keydown event has occurred,
Keyup () event: when the button is released, keyup event occurs, it happens in the current gains focus element,
Note: keydown event has occurred to trigger didn't knock into the text box in the text, but if the output text in a text box in the keydown event has occurred, the
Is triggered keyboard events before the text, the keyup event triggered when the entire keyboard events operation has been completed, the trigger keyboard is
After a text

JQuery keyboard events of the keypress events ()
Keypress () event: capture only a single character, can't capture key combination, can't response system function keys (such as delete, backspace),
Does not distinguish between small keyboard and digital character of the main keyboard, KeyPress is mainly used to receive letters, ANSI characters such as Numbers, and
KeyDown and KeyUP event process can handle any keystroke are not KeyPress recognition, such as function keys
- F12 (F1), edit key, positioning and any of these keys and the combination of the keyboard shift key,

JQuery event bindings and unbundling
Event on ()
nullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnullnull