I've noticed a strange Javascript error which only seems to happen on Internet Explorer 8. Basically, on IE-8 if you have an event handler function which captures the event object in a closure, the event "type" property seems to become invalidated from within the closure.
Here's a simple code snippet which reproduces the error:
<html>
<head>
<script type = "text/javascript">
function handleClickEvent(ev)
{
ev = (ev || window.event);
alert(ev.type);
window.setTimeout(function() {
alert(ev.type); // Causes error on IE-8
}, 20);
}
function foo()
{
var query = document.getElementById("query");
query.onclick = handleClickEvent;
}
</script>
</head>
<body>
<input id = "query" type = "submit">
<script type = "text/javascript">
foo();
</script>
</body>
</html>
So basically, what happens here is that within the handleClickEvent function, we have the event object ev. We call alert(ev.type) and we see the event type is "click". So far, so good. But then when we capture the event object in a closure, and then call alert(ev.type) again from within the closure, now all of a sudden Internet Explorer 8 errors, saying "Member not found" because of the expression ev.type. It seems as though the type property of the event object is mysteriously gone after we capture the event object in a closure.
I tested this code snippet on Firefox, Safari and Chrome, and none of them report an error condition. But in IE-8, the event object seems to become somehow invalidated after it's captured in the closure.
Question: Why is this happening in IE-8, and is there any workaround?
