Function for Automatically Searching events for firefox event Processing (for onclick = foo ())

Handling IE and firefox events
In ie, event objects are saved and maintained as global variables. All browser events, whether triggered by users
Or other events will update the window. event object. Therefore, in the code, you only need to easily call window. event
You can easily get the event object, and then event. srcElement can get the element that triggers the event for further processing.
In ff, the event object is not a global object. Generally, it occurs on site and is used on site. ff automatically transmits the event object
To the corresponding event processing function. In the code, the first parameter of the function is the event object under ff.
The above is my personal understanding of the event handling methods in the two browsers. I may not quite understand it. I will write some code
Details
Copy codeThe Code is as follows:
<Button id = "btn1"> button 1 </button>
<Button id = "btn2"> button 2 </button>
<Button id = "btn3"> button 3 </button>
<Script>
Window. onload = function (){
Document. getElementById ("btn1"). onclick = foo1
Document. getElementById ("btn2"). onclick = foo2
Document. getElementById ("btn3"). onclick = foo3
}
Function foo1 (){
// In ie, window. event makes the Global Object
Alert (window. event) // under ie, "[object]" is displayed, and "undefined" is displayed under ff"
// In ff, the first parameter is automatically used as the event object
Alert (arguments [0]) // under ie, "undefined" is displayed, and "[object]" is displayed under ff.
}
Function foo2 (e ){
Alert (window. event) // under ie, "[object]" is displayed, and "undefined" is displayed under ff"
// Note that I have never passed a parameter to foo2. Now ff automatically transmits the parameter to foo2, And the passed parameter e is the event object.
Under alert (e) // ie, "undefined", ff "[object]" is displayed.
}
Function foo3 () {// compatible with both the writing of ie and ff, take the event object
Alert (arguments [0] | window. event) // under ie and ff, "[object]" is displayed.
Var evt = arguments [0] | window. event
Var element = evt. srcElement | evt.tar get // get the btn3 object in ie and ff
Alert (element. id) // btn3
}
</Script>

Here, we seem to have understood the handling methods of both ie and ff events and found a solution.
But .... The event is not over yet.
View code
Copy codeThe Code is as follows:
<Button id = "btn" onclick = "foo ()"> button 1 </button>
<Script>
Function foo (){
Alert (arguments [0] | window. event)
}
</Script>

Unfortunately, the result given by foo is undefined, not the expected object.
The reason is the event binding method.
Onclick = "foo ()" means to directly execute the foo () function without any parameters,
In this case, firefox has no chance to pass any parameters to foo.
In the case of btn. onclick = foo, firefox has the opportunity to pass parameters to foo because it does not directly execute the function.
Solution:
Method 1: This is a stupid method. Since firefox does not have the opportunity to pass parameters, it is easy to pass parameters by yourself.

Copy codeThe Code is as follows:
<Button id = "btn" onclick = "foo (event)"> button </button>
<Script>
Function foo (){
Alert (arguments [0] | window. event)
Var evt = arguments [0] | window. event
Var element = evt. srcElement | evt.tar get
Alert (element. id)
}
</Script>

Method 2: automatic search
Copy codeThe Code is as follows:
<Button id = "btn4" onclick = "foo4 ()"> button 4 </button>
<Script>
Function foo4 (){
Var evt = getEvent ()
Var element = evt. srcElement | evt.tar get
Alert (element. id)
}
Function getEvent () {// compatible with both ie and ff
If (document. all) return window. event;
Func = getEvent. caller;
While (func! = Null ){
Var arg0 = func. arguments [0];
If (arg0 ){
If (arg0.constructor = Event | arg0.constructor = MouseEvent)
| (Typeof (arg0) = "object" & arg0.preventDefault & arg0.stopPropagation )){
Return arg0;
}
}
Func = func. caller;
}
Return null;
}
</Script>

Method 2 is original by lostinet. I have improved it based on it. The original function is as follows:
Copy codeThe Code is as follows:
Function SearchEvent ()
{
// IE
If (document. all)
Return window. event;
Func = SearchEvent. caller;
While (func! = Null)
{
Var arg0 = func. arguments [0];
If (arg0)
{
If (arg0.constructor = Event)
Return arg0;
}
Func = func. caller;
}
Return null;
}

Summary:
In both of the preceding solutions, the event handling in ff and ie is handled correctly (whether onclick = "foo ()" or onclick = foo)
However, it is recommended that you use the getEvent () method to handle event issues in a unified manner.