Core methods for deleting events by reading jQuery 12th

. Remove is the opposite of. add mentioned in the previous article. The deletion method corresponds to the processing code in. add, that is, the deletion method for adding events in. add. remove.

. Remove defines four parameters: elem, types, handler, and pos. Literally, the meaning of the four parameters is quite clear.

ElemHTMLElement

TypesString type. The event name is 'click' or 'mouseover mouseout'

HandlerIt is a Function type, and the Event Callback Function

PosNumber type, specify the array position

However, removing is not that easy internally, as shown in figure
1. handler sometimes transfers the Boolean Type false, and then assigns the handler value to another function (the processing here is the same as. add ).

Copy codeThe Code is as follows: if (handler = false ){
Handler = returnFalse;
}

2. types is sometimes an object. The real handler is types. handler, And the types is types. type.Copy codeThe Code is as follows: // types is actually an event object here
If (types & types. type ){
Handler = types. handler;
Types = types. type;
}

We know that variable naming must be meaningful, so we can avoid misleading variables. In this sense, there are a lot of such expressions in jQuery. A variable often has multiple meanings and is difficult to read. For example, the types here should be of the String type, but the typeos is also processed internally as the Object type. This is because JS does not have a type check. In turn, this language is flexible, and jQuery is so compact and cohesive.
Let's talk a little about it and see what the. remove Method has done.
1. When only elem is uploaded, all events added to elem are deleted. For example, $ ('# id'). unbind ()
2. When types is String and starts with a period (.), events in the namespace are deleted. For example, $ ('# id'). unbind ('. name '). Click. name and mouseover. name will be deleted.
The corresponding code is as follows:Copy codeThe Code is as follows: // Unbind all events for the element
If (! Types | typeof types === "string" & types. charAt (0) === "."){
Types = types | "";
For (type in events ){
JQuery. event. remove (elem, type + types );
}
Return;
}

We found that for in is a recursive call.
If so
JQuery. event. remove (el, 'click', fn)
Instead of going to the surface recursively, it directly enters the while loop.Copy codeThe Code is as follows: while (type = types [I ++]) {
...
}

This is a standard process for deleting events. The procedure is as follows:
1. Determine whether the event name has a namespace (separated by dots). If there is no namespace, delete all events under the event name. Otherwise, only an event of the namespace will be deleted.
2. Get the event array (eventType = events [type]). If handler is not passed, all hanlders of this type of event will be deleted. Otherwise, only the specified handler of this event type will be deleted.
3. Handling special events (such as live)
4. Finally, process elemData. If events is empty, delete the events and handle attributes of elemData. For exampleCopy codeThe Code is as follows: // Remove the expando if it's no longer used
If (jQuery. isEmptyObject (events )){
Var handle = elemData. handle;
If (handle ){
Handle. elem = null;
}
Delete elemData. events;
Delete elemData. handle;
If (jQuery. isEmptyObject (elemData )){
JQuery. removeData (elem, undefined, true );
}
}

JQuery event management data structure: