Analysis of sogou cloud Input Method JS files (3)

This article mainly analyzes the imeBindInput function.

I found that there are some problems with decompression code on the Internet. Because I have not studied the code compression algorithm, I am not very familiar with decompression, so I have no energy to precisely restore all the code for the moment, since this article analyzes the imeBindInput function, you can directly extract the code from the memory:Copy to ClipboardReference: [www.bkjia.com] imeBindInputfunction imeBindInput (){
Try {
Var B = a. getElementsByTagName ("input ");
For (var I = 0; I <B. length; I ++ ){
If (B [I]. type = "text "){
B [I]. imebind = true;
B [I]. onkeyup = null;
B [I]. onkeydown = null;
B [I]. onkeypress = null;
B [I]. onfocus = null;
B [I]. onblur = null;
B [I]. onclick = null;
If (document. addEventListener ){
B [I]. addEventListener ("keyup", imeInput, true );
B [I]. addEventListener ("keydown", imeKeyDown, true );
B [I]. addEventListener ("keypress", imeKeyPress, true );
} Else if (document. attachEvent ){
B [I]. detachEvent ("onkeydown", B [I]. onkeydown );
B [I]. detachEvent ("onkeyup", B [I]. onkeyup );
B [I]. detachEvent ("onkeypress", B [I]. onkeypress );
B [I]. detachEvent ("onfocus", B [I]. onfocus );
B [I]. detachEvent ("onblur", B [I]. onblur );
B [I]. attachEvent ("onkeyup", imeInput );
B [I]. attachEvent ("onkeydown", imeKeyDown );
B [I]. attachEvent ("onkeypress", imeKeyPress );
} Else {
Var c = B [I]. onkeyup? B [I]. onkeyup: function (){};
B [I]. onkeyup = function () {c (); imeInput ();};
Var d = B [I]. onkeydown? B [I]. onkeydown: function (){};
B [I]. onkeydown = function () {d (); imeKeyDown ();};
Var f = B [I]. onkeypress? B [I]. onkeypress: function (){};
B [I]. onkeypress = function () {f (); imeKeyPress ();};
}
}
}
Var g = a. getElementsByTagName ("textarea ");
For (var I = 0; I <g. length; I ++ ){
G [I]. imebind = true;
G [I]. onkeyup = null;
G [I]. onkeydown = null;
G [I]. onkeypress = null;
G [I]. onfocus = null;
G [I]. onblur = null;
G [I]. onclick = null;
If (document. addEventListener ){
G [I]. addEventListener ("keyup", imeInput, true );
G [I]. addEventListener ("keydown", imeKeyDown, true );
G [I]. addEventListener ("keypress", imeKeyPress, true );
} Else if (document. attachEvent ){
G [I]. detachEvent ("onkeydown", g [I]. onkeydown );
G [I]. detachEvent ("onkeyup", g [I]. onkeyup );
G [I]. detachEvent ("onkeypress", g [I]. onkeypress );
G [I]. detachEvent ("onfocus", g [I]. onfocus );
G [I]. detachEvent ("onblur", g [I]. onblur );
G [I]. attachEvent ("onkeyup", imeInput );
G [I]. attachEvent ("onkeydown", imeKeyDown );
G [I]. attachEvent ("onkeypress", imeKeyPress );
} Else {
Var c = g [I]. onkeyup? G [I]. onkeyup: function (){};
G [I]. onkeyup = function () {c (); imeInput ();};
Var d = g [I]. onkeydown? G [I]. onkeydown: function (){};
G [I]. onkeydown = function () {d (); imeKeyDown ();};
Var f = g [I]. onkeypress? G [I]. onkeypress: function (){};
G [I]. onkeypress = function () {f (); imeKeyPress ();};
}
}
If (a. addEventListener ){
A. addEventListener ("keydown", imeBodyKeyDown, true );
A. addEventListener ("mousedown", imeBodyMouseDown, true );
} Else if (a. attachEvent ){
A. attachEvent ("onkeydown", imeBodyKeyDown );
A. attachEvent ("onmousedown", imeBodyMouseDown );
A. attachEvent ("onactivate", imeBodyActive );
} Else {
Var l = a. onmousedown? A. onmousedown: function (){};
A. onmousedown = function () {l (); imeBodyMouseDown ();};
}
Var m = a. getElementsByTagName ("iframe ");
For (var I = 0; I <m. length; I ++ ){
Try {
If (m [I]. contentDocument ){
Var a = m [I];
Ime_iframe_arr.push ();
A. imebind = true;
Var a = a. contentDocument;
ImeBindInput ();
} Else if (mpolici}.content?#doc ument ){
Var a = m [I];
Ime_iframe_arr.push ();
A. imebind = true;
Var a = a.content1_doc ument;
ImeBindInput ();
}
} Catch (e ){
}
}
} Catch (e ){
}
} Start with the overall situation: we can see that the bound areas are: 1. type = text input box 2. in addition, textarea3.iframe binds the top-level elements (document here) to events: 1. if it is a standard browser, bind the keydown/mousedown2. if it is an IE browser, append the activate event 3. others only append the mousedown event PS: This function uses a try statement. It seems that the author is not very confident about this operation ~~ Let's take a look at how the simplest text input box binds events.Copy to ClipboardReference: [www.bkjia.com] B [I]. imebind = true;
B [I]. onkeyup = null;
B [I]. onkeydown = null;
B [I]. onkeypress = null;
B [I]. onfocus = null;
B [I]. onblur = null;
B [I]. onclick = null;
If (document. addEventListener ){
B [I]. addEventListener ("keyup", imeInput, true );
B [I]. addEventListener ("keydown", imeKeyDown, true );
B [I]. addEventListener ("keypress", imeKeyPress, true );
} Else if (document. attachEvent ){
B [I]. detachEvent ("onkeydown", B [I]. onkeydown );
B [I]. detachEvent ("onkeyup", B [I]. onkeyup );
B [I]. detachEvent ("onkeypress", B [I]. onkeypress );
B [I]. detachEvent ("onfocus", B [I]. onfocus );
B [I]. detachEvent ("onblur", B [I]. onblur );
B [I]. attachEvent ("onkeyup", imeInput );
B [I]. attachEvent ("onkeydown", imeKeyDown );
B [I]. attachEvent ("onkeypress", imeKeyPress );
} Else {
Var c = B [I]. onkeyup? B [I]. onkeyup: function (){};
B [I]. onkeyup = function () {c (); imeInput ();};
Var d = B [I]. onkeydown? B [I]. onkeydown: function (){};
B [I]. onkeydown = function () {d (); imeKeyDown ();};
Var f = B [I]. onkeypress? B [I]. onkeypress: function (){};
B [I]. onkeypress = function () {f (); imeKeyPress ();};
} First, append the imebind attribute to the input box, and then describe the keyboard, focus, and click tasks of the input box (only for <span click = "…"> Click me </span>). As for why, I cannot understand why. Doesn't this change the original element event? It's hard and thankless. Finally, events are bound based on different browsers. It should be encapsulated, but there is no way. I took special care of IE (detachEvent deleted the event first). Why, I can't understand it again. It seems that my capabilities in event binding are too poor. For example, I cannot tell B [I]. onkeyup = null and B [I]. detachEvent ("onkeyup", B [I]. onkeyup. Well, let's summarize it a little bit. Mainly bind three events to the input box: keyup => imeInputkeydown => imeKeyDownkeypress => imeKeyPress-er, why does the keyup correspond to imeKeyUp? Next is the textarea element. The difference should be handled by carriage return. After a brief glance, we found that the Code is the same as the text input box, and three events are also bound.

Finally, it is the binding of iframe. At this time, it is mainly to use imeBindInput to call its own recursion.Copy to ClipboardReference: [www.bkjia.com] if (m [I]. contentDocument ){
Var a = m [I];
Ime_iframe_arr.push ();
A. imebind = true;
Var a = a. contentDocument;
ImeBindInput ();
} Else if (mpolici}.content?#doc ument ){
Var a = m [I];
Ime_iframe_arr.push ();
A. imebind = true;
Var a = a.content1_doc ument;
ImeBindInput ();
} The code was a bit speechless, but it had to be done for execution speed.
If I write it as follows:Copy to ClipboardReference: [www.bkjia.com] var I = m [I];
If (var a = I. contentDocument | I .content##doc ument)
Ime_iframe_arr.push (I );
I. imebind = true;
ImeBindInput ();
} OK. Now let's summarize it. This function is mainly used for common input boxes (type = text input and textarea) under the parameter (document at the beginning) (including iframe) bind three Keyboard Events (keyup/keydown/keypress), and finally bind the keydown/mousedown/activate events of the parameter (3 for IE, 2 for standard, bind one other instance.-It's complicated ~~~)