jquery's Click event Object Trial Solution

While writing this document, I did not go into the details of what the JQuery event object was, but in my previous experience I was able to say that, and maybe 80% was correct, so I don't recommend this document to be authoritative, but as a refreshment after dinner, a little taste, See how I understand this object. Of course, before this I must have known the JS native event object, or else will not suddenly want to publish an article of jquery.

We typically access this event object by accessing the first parameter of the event handler for the Click event, which is what people often call an event object, and here's a look at JavaScript native event objects (chrome) and jquery events objects. This article mainly is the jquery event object mainly.

It can be seen that there are some inconsistencies between jquery and the native.

Here are some of the object properties or methods to perform a description.

I. Altkey, Ctrlkey, Shiftkey, Metakey

So, this is the Alt,ctrl,shift and meta (the CMD key on the window key/mac), which specifies that the four attributes in the event object are used to determine if the user is holding down some of these keys (allowing simultaneous hold) To the corresponding current event type, where the main click event is mainly, after holding, the corresponding value is changed from false to true;

Ii. bubbles, Stoppropagation, Stopimmediatepropagation, ispropagationstopped, eventphase

These are all related to event bubbling/capturing (the following mainly bubble-based), where Bubbles and stopimmediatepropagation with my current state can not explain the thorough elimination, but look down.

Bubbles : Judging whether the current event is bubbling, Boolean type, I naively thought all things would go according to the routine, and found that when I test mouseenter this non-bubbling event, this value is true, But fortunately other non-bubbling properties such as focus and Blur are normal (the bubbles above MouseEnter is true in jquery, false in native);

stoppropagation: This is a way to call through Event.stoppropagation () and block the event bubbling, since there is bubbles this property to determine whether the event can bubble, then this method will need the support of this property, In the event that bubbles is false and the event does not support bubbling, this method has nothing to do with.

stopimmediatepropagation : This method is similar to stoppropagation and blocks any function calls that are bound by events, unless I can think of other calling methods, otherwise Stoppropagation also blocks the event invocation above the bubbling.

ispropagationstopped: As the name implies, this method is to determine whether the bubble has been blocked, if it has been blocked, then return true, otherwise return false;

eventphase : Determine which stage is currently in (1 capture, 2 in target, 3 bubbling)

Three, cancelable, Preventdefault, isdefaultprevented

　　cancelable : Determines whether to allow blocking of default behavior (for example: input box does not block focus and blur behavior)

　　Preventdefault : This method blocks the default behavior, for example a link is adjusted by default, and a form with a type of submit is added and the Send action is adjusted by default.

　　isdefaultprevented : The method returns whether the default behavior has been blocked.

Iv. button, buttons, which

button: What is the mouse button that the user clicked? Left (0), Middle key (1), right (2)

buttons:(key combination) did not find the relevant information

which: (Press and hold the mouse which key (1 left) (2) (3 right) does not find the relevant information

V. Currenttarget, Delegatetarget, Target, Fromelement, Toelement, Relatedtarget

currenttarget: The element of the current binding event handler, as in the This effect

delegatetarget: equivalent to currenttarget

target: The actual target element, when the event is bound to the parent element, and we click on the child element, then target is the child element.

fromelement: On the Click event, this attribute is the native attribute used by Null,jquery, referring to the element that precedes the event, usually in the event type of the mouse movement, such as MouseOver, Mouseout

toelement: Refers to the element immediately following the handling of the event, such as the Click and MouseOver event in which the value is currenttarget, in Mouseout, which is the first element encountered after the move out.

Relatedtarget: on the Click event, this property is null, returning the element that is associated with the current event, which is not equal to this, either the element before the entry, or the element that is left, through Mouseout, mouseover

Vi. ClientX, ClientY, OffsetX, OffsetY, PageX, Pagey, ScreenX, ScreenY

ClientX, ClientY: the distance (in pixels) from the left and top of the mouse pointer from the browser view area

OffsetX, OffsetY: distance of the mouse pointer from the right and top of the current currenttarget

PageX, Pagey: The position of the mouse pointer in the page (only the values of the two properties are consistent with ClientX, ClientY in the first screen)

ScreenX, ScreenY: The distance of the mouse pointer relative to the left and top of the screen

Well, today, the first use of the client to send essays, Sao taste a little excited ah.

jquery's Click event Object Trial Solution