Events in 1.jQuery
in jquery, events are grouped into two broad categories: base events and conformance events. simple events in jquery, with events in JavaScript
Almost the same, there are mouse events, keyboard events, load events, and so on, but its corresponding method name is slightly different.
Conforming events are handlers that intercept the combination of user actions and that are customized in response to multiple functions.
Common Event Categories:
Underlying events: mouse events, keyboard events, window events, form events
Match events: mouse cursor hover, mouse continuous click
1. The syntax format for event bindings and handler functions is as follows:
Base event Syntax:
Event name = "function name ()";
Or:
The DOM object. Event name = function;
after the event-binding handler, the call handler function can be displayed through the DOM object. Event name ().
2. Loading events:
in jquery, the usual window event has a document loading event, and the corresponding method is ready ();
3. Mouse events:
As you can see, the method name of the event in jquery is not the same as the JavaScript event method name, such as a click event.
Write the onclick in JavaScript, and click in jquery.
MouseEnter () and mouseover () use the same as when the mouse pointer moves over the page element when the event is triggered.
The difference is as follows:
MouseOver (); When the mouse pointer enters the selected element, the MouseOver event is triggered if the mouse pointer is over the child element of the selected element
The MouseOver event will also be triggered when entering.
MouseEnter (); When the mouse pointer enters the selected element, the MouseEnter event is triggered if the mouse pointer is over the child element of the selected element
The MouseEnter event is not triggered when the return is entered.
Mouseout (); When the mouse pointer enters the selected element, the Mouseout event is triggered if the mouse pointer is over the child element of the selected element
The Mouseout event will also be triggered when entering.
MouseLeave (); When the mouse pointer enters the selected element, the MouseLeave event is triggered if the mouse pointer is over the child element of the selected element
The MouseLeave event is not triggered when the return is entered.
Simple difference:
Enter the code link:
:
1: But mouse hover when the background color of the page is: orange
2: But mouse hover when the background color of the page is: Pink
4. Keyboard events:
Common keyboard events are KeyDown, KeyUp, KeyPress
When the KeyDown event occurs when the keyboard is pressed, the KeyUp event occurs when the keyboard is released, between KeyDown and KeyUp
Triggers another event------the KeyPress event. When you press the key repeatedly to produce a character, there may be a lot of KeyUp before the event
Below enter the Code case link:
Style:
Environment settings:
The effect is as follows:
Note: The following will also show the properties of the called method when you enter the password, and the prompt box will pop up when you click Enter in the Password box.
Keycode==13 means that Cmdlogoln gets focus when the ENTER key is pressed
Binding events and removing events
1: Bind Event
Grammar:
Bind (type, [DATA],FN)
Case:
In addition to the Bind method there is on () Live () One ()
To remove an event:
Grammar:
Nubind ([TYPE],[FN])
Composite event:
Methods: Hover () and toggle ()
Hover ():
Grammar:
Hover (enter, leave);
Toggle ()
Grammar:
Have a reference
Toggle (fn1, fn2,fn3,........ FnN);
No reference
Toggle ();
Toggleclass (ClassName);
Code:
:
Display and hide of elements
Display of control elements:
Grammar:
$ (selector). Show ([Speed],[callback]);
Control element hiding:
Grammar:
$ (select). Hide ([speed],[callback]);
To change the transparency of an element:
$ (select). Fadeid ([Speed],[callback]);
Control element Fade Out
Grammar:
$ (select). FadeOut ([Speed],[callback]);
Change the height of the element:
$ (selector). Slidup ([Speed],[callback]);
$ (selector). Sliddown ([Speed],[callback]);
Custom animations:
Grammar:
$ (selector). Animate ({params},speed,callback)
Events and drivers in jquery