Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

window.event !== window.event in IE

Code:

<html>
<head>
<script type="text/javascript">
  onload = function(){
    document.getElementById('btn1').onclick = function(){   
      if (window === window)  
        alert('window === window')
      else
        alert('window !== window');

      if (window.event === window.event)  
        alert('window.event === window.event')
      else
        alert('window.event !== window.event' );   
    }
  }
</script>
</head>
<body>
<button id="btn1" >click</button>
</body>
</html>

Result:

IE(i have tested IE6 - IE8) says:

window === window
window.event !== window.event

All other browsers say:

window === window
window.event === window.event

What's the reason for IE's response? Thanks.

like image 946
iacnats Avatar asked Sep 18 '12 01:09

iacnats


People also ask

What is window event?

A low-level event that indicates that a window has changed its status. This low-level event is generated by a Window object when it is opened, closed, activated, deactivated, iconified, or deiconified, or when focus is transfered into or out of the Window.

Which window event is used to create a new window?

The open() method opens a new browser window, or a new tab, depending on your browser settings and the parameter values.

Are window events deprecated?

event. Deprecated: This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes.

What is event browser?

What are browser events? An event refers to an action or occurrence that happens in the system you are programming. The system then notifies you about the event so that you can respond to it in some way if necessary. In this article, I will focus on events in the context of web browsers.


2 Answers

I did some experimenting. It looks like every time you access window.event in IE, you get a new object:

document.body.onclick = function() {
    var u = window.event, v = window.event;
    console.log(window.event == window.event); // false
    console.log(u == v); // false
    console.log(u == u); // true
    console.log(v == v); // true
    console.log(u == window.event); // false
    console.log(v == window.event); // false
};

So whenever you retrieve window.event, IE creates a new object. If you test that object against itself (u == u or v == v) it is true. If you test it against another window.event object, it's false.

(Note that this is different behavior from NaN, as var a = NaN; console.log(a == a); is false.)

Think of window.event as something like a generator, more like window.createCopyOfLastEvent() in IE. window.event is a getter which always returns a new object. The following illustrates this point:

document.body.onclick = function() {
    var v = window.event;
    v.a = 1;
    console.log(v.a); // 1
    console.log(window.event.a); // undefined
};

In the above example, window.event.a is undefined when it is logged because it refers to a different object, than the one where a = 1.

To further illustrate, this behavior could be recreated in pure JavaScript (in a ES5 supported browser: IE9, or latest versions of FF, Chrome, or Safari):

var weirdObject = Object.create({ }, {
    whoa: {
        get: function() {
            return new Object();
        }
    }
});

console.log(weirdObject.whoa == weirdObject.whoa); // false

Or maybe even stranger looking:

Object.defineProperty(window, 'ahh', {
    get: function() {
        return Math.random();
    }
});

console.log(ahh == ahh); // false
like image 186
Nathan Wall Avatar answered Oct 24 '22 06:10

Nathan Wall


Update: Read this: IE Bug (window === top) === false

In short -- IE is broken and doesn't compare host objects well.

Not all browsers support window.event. Most use an event object passed to the function. (window.event was considered an IE specific thing, though it appears that Chrome has copied it.)

Try this:

 document.getElementById('btn1').onclick = function(event){   
  if (!event) {event = window.event;}

  alert([typeof event, typeof window.event])

  if (window === window)  
    alert('window === window')
  else
    alert('window !== window');

  if (window.event === window.event)  
    alert('window.event === window.event')
  else
    alert('window.event !== window.event' );   
}

}

like image 20
Jeremy J Starcher Avatar answered Oct 24 '22 06:10

Jeremy J Starcher