Question

jQuery中是否有任何函数可以返回true或false如果鼠标输入其子元素？

我想看看我能用的东西：

if ( $(this).mouseIsOnChild() ) {
    // mouse is on a child element
} else {
    // mouse leaved branch of HTML tree
}

courese .mouseIsOnChild()函数不存在。爱好。

Answer 1

//track hover state    
$('*').hover(function() {
            $(this).data('hover', true); 
        }, function() {
            $(this).data('hover', false);
        });

//plugin to check whether mouse is on children
$.fn.mouseIsOnChild = function() {
    var ret = false;
    $(this).children().each(function() {
            ret = $(this).data('hover');
            return ret ? false : true;
        });
    return ret;
}

Answer 2

是。 mouseenter()和mouseleave()事件存在。

使用这个我们可以构建一个数据结构来检查鼠标是否在孩子的区域中：

$(function() {
    var isIn = false;
    $(target).children().mouseenter(function() {isIn = true;});
    $(target).children().mouseleave(function() {isIn = false;});

    var isMouseIn = function() { return isIn; };
});

现在，如果鼠标在子项内，则函数isMouseIn()返回true，否则返回false。

如果您想获得幻想，可以将自定义数据附加到target节点而不是全局变量。我将把它作为锻炼的动机。

Answer 3

在事件处理程序中 - 您可以检查e.target（e是否是事件处理函数中传递的参数）是使用.is()

if($(this).children('div').is(e.target)){ 
// replacing $(this).children('div') with the children element selector
}else{

}

FIDDLE

如果您不是寻找特定的孩子，而是寻找任何孩子，您可以做这样的事情

if($('>*',this).is(e.target)){
    // do something if it's children
}else{

}

FIDDLE

在jQuery鼠标中检测到输入了一个子元素？

3 个答案: