Cannot use onmouseover event in select option in IE

Question

Updated code:

function getElements()
  {
  var x=document.getElementsByTagName("option");

var el = document.getElementById('selectDept');
el.onmouseover = function( myevent ) {
   // event = event || window.event.srcElement;
if(myevent && myevent.target){
    if ( myevent.target.tagName.toLowerCase() == 'option' ) {
        alert(myevent.target.innerHTML);
    }
}
else if(window.event)
{
   if ( window.event.srcElement.tagName.toLowerCase() != 'select' ) {
        alert('s');
    }

}
};

but still not working in IE.

Answer 1

Can't you set the mouseover event handler as a whole and select the event property, if the target is an option element, execute action X?

var el = document.getElementById('foo')
el.onmouseover = function( event ) {
    event = event || window.event;
    var target = event.target ? event.target : event.srcElement;
    if ( target.nodeName.toLowerCase() === 'option' ) {
        alert('option');
    }
}

Updated code:

http://jsbin.com/olusi

Answer 2

IE does not support events in an element . You can try, as @meder says, to add a handler to the parent selection, and then check the event to see which option has been processed.

PS IE6 ( - IE7 IE8) ): - (

, IE9 ?