IE8 auf schweben der Auswahlbox die Optionen

Question

Ordnung zu brechen, so habe ich den folgenden Code, der in allen Browsern außer IE ..

$('input[title!=], select[title!=]').mouseenter(function(){ 
    if ($(this).data('focused')!='y') { 
     $(this).data('t', this.title).data('focused', 'y'); 
     this.title = ''; 
     var pos = $(this).position(); 
     $('body').append('<div id="toolTip" class="round-5 shadow-heavy"><img class="arrow" src="/images/bg/toolTip.png" alt="" />'+($(this).data('t'))+'</div>'); 
     $('#toolTip').css('top',(pos.top+($(this).height()/2)-($('#toolTip').innerHeight()/2))+'px').css('left',(pos.left+($(this).innerWidth())+20)+'px'); 
    } 
}).mouseleave(function(){ 
    if ($(this).data('focused')!='n') { 
     $(this).data('focused', 'n'); 
     this.title = $(this).data('t'); 
     $('#toolTip').remove(); 
    } 
}).focus(function(){if($(this).data('focused')!='y'){$(this).trigger('mouseenter');}}).blur(function(){if($(this).data('focused')!='n'){$(this).trigger('mouseleave');}}); 

nun in IE funktioniert gut, wenn Sie das Auswahlfeld öffnen und bewegen Sie die Maus Über eine der Optionen schließt sich die Box. Was das verursacht, ist, dass der IE die Dropdown-Box der Optionen anscheinend nicht als Teil des select-Elements zählt, so dass er das mouseleave-Ereignis auslöst.

Kennt jemand eine Lösung um dies?

Answer 1

IE insbesondere eine sehr bizarre Umsetzung <select>, da IE6 (evtl. früher) aus WinForms in Mitleidenschaft gezogen wurde ... was auch der Grund ist, es aber eine in älteren Versionen oben auf alles sitzt.

Leider sind Ereignisse auf oder beteiligt <option> Elemente bestenfalls unzuverlässig (wie Sie sehen) ... und kann nicht in IE vertraut werden. Sie könnten das Verhalten im IE deaktivieren, aber das ist die einzige "Reparatur", die es gibt.

Die Alternative ist, die <select> vollständig zu ersetzen, es gibt ein paar jQuery-Plugins, die dies tun, check out this question for options around that.