onchange not working in internet explorer

[Mister Joe]

I have a page and if the user has javascript enables I am trying to
dynamically change a link to a sitemap to a dropdown menu (that when
the option is changed will forward the user to another page). Here's
the code

try{

var sel = document.createElement("select");

sel.setAttribute("onchange", "alert('');");

for(var i=0;i<this.labels.length;i++){

var op = document.createElement("option");

op.value = this.hrefs;

op.appendChild(document.createTextNode(this.labels));

sel.appendChild(op);

}



var ql = document.getElementById("quicklinks");

ql.replaceChild(sel, ql.firstChild);

if(document.body){

alert(document.body.innerHTML);

alert(sel.getAttribute("onchange"));

}

}catch(e){alert(e.name+"\n"+e.message)

}

This works fine in firefox and when I display the generated html it
shows the select node w/ the appropriate onchange attribute in both ff
and ie. The problem is that the event is not working in ie. For some
reason changing the option does nothing. Any ideas? Also is this the
most unobtrusive way to achieve a quick links menu. Part of me is
considering just using an html/css vertical menu instead of a pull
down.

Thanks Guys

 

[Mister Joe]

I have a page and if the user has javascript enables I am trying to
dynamically change a link to a sitemap to a dropdown menu (that when
the option is changed will forward the user to another page). Here's
the code

try{

var sel = document.createElement("select");

sel.setAttribute("onchange", "alert('');");

for(var i=0;i<this.labels.length;i++){

var op = document.createElement("option");

op.value = this.hrefs;

op.appendChild(document.createTextNode(this.labels));

sel.appendChild(op);

}

var ql = document.getElementById("quicklinks");

ql.replaceChild(sel, ql.firstChild);

if(document.body){

alert(document.body.innerHTML);

alert(sel.getAttribute("onchange"));

}

}catch(e){alert(e.name+"\n"+e.message)

}

This works fine in firefox and when I display the generated html it
shows the select node w/ the appropriate onchange attribute in both ff
and ie. The problem is that the event is not working in ie. For some
reason changing the option does nothing. Any ideas? Also is this the
most unobtrusive way to achieve a quick links menu. Part of me is
considering just using an html/css vertical menu instead of a pull
down.

Thanks Guys

I actually got the event to work by using attachEvent and
addEventListener...but I'm still wondering if what I'm doing is the
most unobtrusive way.

 

[scripts.contact]

I actually got the event to work by using attachEvent and
addEventListener...but I'm still wondering if what I'm doing is the
most unobtrusive way.

use -
element.onchange=FuncName
or
element.onchange=function(){ doWhatever() }

the above works in all browsers, afaik.

 

[Darko]

I have a page and if the user has javascript enables I am trying to
dynamically change a link to a sitemap to a dropdown menu (that when
the option is changed will forward the user to another page). Here's
the code

try{

var sel = document.createElement("select");

sel.setAttribute("onchange", "alert('');");

for(var i=0;i<this.labels.length;i++){

var op = document.createElement("option");

op.value = this.hrefs;

op.appendChild(document.createTextNode(this.labels));

sel.appendChild(op);

}

var ql = document.getElementById("quicklinks");

ql.replaceChild(sel, ql.firstChild);

if(document.body){

alert(document.body.innerHTML);

alert(sel.getAttribute("onchange"));

}

}catch(e){alert(e.name+"\n"+e.message)

}

This works fine in firefox and when I display the generated html it
shows the select node w/ the appropriate onchange attribute in both ff
and ie. The problem is that the event is not working in ie. For some
reason changing the option does nothing. Any ideas? Also is this the
most unobtrusive way to achieve a quick links menu. Part of me is
considering just using an html/css vertical menu instead of a pull
down.

Thanks Guys

As far as I know, the problem is that Internet Explorer recognizes
something changed just after you lose focus on that element. That is,
it "thinks" you're still changing it and will wait until you click
somewhere on the side or on another element. If so, try combining with
<option onclick> or something like that.