IE8 ломается при наведении курсора на опции окна - PullRequest
1 голос
/ 15 декабря 2010

Хорошо, у меня есть следующий код, который отлично работает во всех браузерах, кроме 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');}});  

Теперь в IE, если вы откроете поле выбора и наведете указатель мыши на один из вариантов,коробка закрывается.Причиной этого является то, что IE, по-видимому, не считает выпадающий список опций частью элемента select, поэтому вызывает событие mouseleave.

Кто-нибудь знает, как это исправить?

1 Ответ

2 голосов
/ 15 декабря 2010

IE, в частности, имеет очень причудливую реализацию <select>, так как IE6 (возможно, ранее) был извлечен из winforms ... что также является причиной того, что он стоит на вершине чего-либо, кроме<iframe> в более старых версиях.

К сожалению, события на или включающие элементы <option> в лучшем случае ненадежны (как вы видите) ... и им нельзя доверять в IE.Вы можете отключить поведение в IE, но это единственное исправление.

Полная альтернатива - полная замена <select>, есть несколько плагинов jQuery, которые делают это, проверьте этот вопрос, чтобы узнать, какие варианты есть у него .

...