window.event.type not working in firefox

Hi,

Ive got a function like so:

function detetEventType(e) {

if(window.event) {

alert(window.event.type);

} else {

alert(e.type);

}

}

If i call the script from the onchange event of a drop-down list like so: onchange="detectEventType(event);"

Both IE and Firefox return "change" as i would expect.

If i call the function from the window.onload event handler IE returns "load" but Firefox returns nothing....However if i call the same function from <body onload="detectEventType(event);"> all works fine.

Can anyone explain why and how to fix it?

Thanks
partnershipdev
partnershipdevAsked:
Who is Participating?
 
LakioConnect With a Mentor Commented:
I get "load" in firefox, but you can try this.

try useing addEvent function

http://www.quirksmode.org/blog/archives/2005/08/addevent_consid.html
function addEvent(obj, evType, fn, useCapture){
  if (obj.addEventListener){
    obj.addEventListener(evType, fn, useCapture);
    return true;
  } else if (obj.attachEvent){
    var r = obj.attachEvent("on"+evType, fn);
    return r;
  } else {
    alert("Handler could not be attached");
  }
}


http://developer.mozilla.org/en/docs/DOM:element.addEventListener
Why use addEventListener?
addEventListener is the way to register an event listener as specified in W3C DOM. Its benefits are as follows:

It allows adding more than a single handler for an event. This is particularly useful for DHTML libraries or Mozilla extensions that need to work well even if other libraries/extensions are used.
It gives you finer-grained control of the phase when the listener gets activated (capturing vs. bubbling)
It works on any DOM element, not just HTML elements.
The alternative, older way to register event handlers is described below.
0
 
Maverick_CoolCommented:
window.event is not valid in FireFox, use event
0
 
Maverick_CoolCommented:
in you case e which passed as parameter.
0
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
partnershipdevAuthor Commented:
Hi Maverick,

I know window.event is not valid in Firefox - thats the biggest problem.

In firefox you cant seem to pass event into the function from the window.onload event because it doesnt seem to think event is defined....

window.onload="detectEventType(event);"

Returns "event is not defined" in Firefox...
0
 
LakioCommented:
window.onload="detectEventType(event);" ?
try this
onload = detectEventType
0
 
partnershipdevAuthor Commented:
That works, however it leads me onto the next problem....what happens if i want to pass parameters into the function?
0
 
LakioCommented:
onload = function(){ detectEventType(event, parameter1, parameter2, parameterx ) }

does this work?
0
 
Maverick_CoolCommented:
see ur example only its working..
<html>
<head>
<script>
function detetEventType(e) {
 
if(window.event) {
 
alert(window.event.type);
 
} else {
 
alert(e.type);
 
}
 
}
</script>
</head>
<body>
<select onchange="detetEventType(event);">
<option>1</option>
<option>2</option>
</slect>
</body>
</html>

Open in new window

0
 
Michel PlungjanIT ExpertCommented:
Maverick: you do not try the issue at hand - he already knows how to do it inline.

The issue is this:

window.onload=detectEventType; // no parameter passed so no detection in FF
0
 
partnershipdevAuthor Commented:
Ok,

I've got it working by doing the following:

function init(e) {

      //call all my other functions directly from this function....
}

function addEvent(obj, evType, fn, useCapture){
  if (obj.addEventListener){
    obj.addEventListener(evType, fn, useCapture);
    return true;
  } else if (obj.attachEvent){
    var r = obj.attachEvent("on"+evType, fn);
    return r;
  } else {
    alert("Handler could not be attached");
  }
}

addEvent(window,"load",init)
0
 
partnershipdevAuthor Commented:
Sorry, meant to also say that when you call the otheer functions from the init function you can then pass e to other functions....very handy and just wahat i wanted...
0
 
Michel PlungjanIT ExpertCommented:
And this is how:
<head>
<script>
function detectEventType(e) {
   var e = (e)?e:window.event;
   alert(e.type);
}
//window.onload = detectEventType; 
window.onload=function(event){ detectEventType(event) }
</script>
</head>
<body>
</body>
</html>

Open in new window

0
 
LakioCommented:
Does this work also?
<head>
<script>
function detectEventType(event) {
   alert(event.type);
}
onload = function(event){ detectEventType(event) }
</script>
</head>
<body>
</body>
</html>

<html>
<head>
<script>
function detectEventType(event) {
   alert(event.type);
}
onload = function(event){ detectEventType(event) }
</script>
</head>
<body>
</body>
</html>

Open in new window

0
 
Michel PlungjanIT ExpertCommented:
No. That would fail in IE since you overwrite window.event with the event passed to the function - that event is only passed in non-ie browsers so you pass null
0
 
partnershipdevAuthor Commented:
Hi Lakio,

Ill put the points in your direction because it pointed me in the right direction of the solution.

thanks to everyone who contributed.

partnershipdev
0
 
Michel PlungjanIT ExpertCommented:
hmmm..
0
 
partnershipdevAuthor Commented:
mplungian,

Do you disagree?

I'll need to open a new question anyway on the same topic because i have found another problem....hopefully you can contribute towards thta one?

Thanks
0
All Courses

From novice to tech pro — start learning today.