Jquery 在鼠标悬停时高亮显示元素

我在构建元素高亮显示时遇到问题（当鼠标位于元素上方时，高亮显示该元素）

我认为这是由于子-父元素的问题（显然，如果鼠标位于子元素上，则只应高亮显示子元素）， 以下是JSFIDLE：

这就是JS

function highlight(elem,action) {
    if (action) {
        elem.css('border','1px solid red');
    }
    else {
        elem.css('border','');
    }
}
$('#body_wrapper *').mouseenter(function(e) {
    highlight($(this),1);

});
$('#body_wrapper *').mouseout(function(e) {
    highlight($(this),0);
});

---

使用以下代码

function highlight(elem,action, e) {
    if (action) {
        elem.css('border','1px solid red');
    }
    else {
        elem.css('border','');
    }
 e.preventDefault();
e.StopPropagation();
}

---

试试下面，它能起作用。我在那个里添加了条件，所以它只会突出显示最子div

function highlight(elem,action, e) {
    if (action) {
        elem.css('border','1px solid red');
    }
    else {
        elem.css('border','');
    }
 e.preventDefault();
}

$('#body_wrapper *').mouseenter(function(e) {

    if($('.current-highlighted').length == 0){  
        $(this).addClass('current-highlighted');
        highlight($(this),1,e);
    }

});
$('#body_wrapper *').mouseout(function(e) {

    highlight($(this),0,e);
    $(this).removeClass('current-highlighted'); 
});

---

你为什么不使用CSS

：hover

？除了突出显示之外，我还想做其他事情。。我计划收集类/ID并显示它。。然后把它储存起来，问题到底是什么？你实际上并没有说出来。在小提琴中，悬停的元素是高亮显示的，从标题（我是一个项目！）到灰色框（父元素），它没有高亮显示，即使从标题外部（如问题中所述）它应该不会工作，并且错误：Object#没有“StopPropagation”方法