С помощью jQuery, как я могу определить, является ли элемент «мышью» и какие-либо дочерние элементы этого элемента?

Question

Вот что у меня есть:

var hoveredElement; //none per default

;(function($){
$.fn.isHovered = function(){
    return (hoveredElement.length && $( this )[0] === hoveredElement[0] );
};

})(jQuery);


$(document).mouseover( function(e){
    hoveredElement = $(e.target);
});


$(document).mouseover( function(e){
    console.log( $(this).isHovered() );
});

В основном у меня следующая структура:

<div id='one'>
    <div id="two">
        <div id="three">
            three
        </div>
    </div>
</div>

Когда я наведу курсор мыши на два, я бы хотел вернуть true, будь то #two или #three, над которым я наведусь.

Как мне это сделать?

Answer 1

Попробуйте взглянуть на mouseenter и mouseleave это должно дать вам то, что вы ищете

Answer 2

Ваш код работает здесь: http://jsfiddle.net/maniator/LjUu7/2/

Answer 3

Используйте API jQuery .hover(): http://api.jquery.com/hover/, и вы сможете просматривать текущий объект через $(this).

Что-то вроде:

$('div').hover( 
function() { console.log('hovering over %o', $(this) }, 
function() { console.log('leaving') }
);