Jquery Mouseleave和e.target或e.relatedTarget

Question

当我从li.food转到#news-wrap时，mouseleave开火了。

这不起作用：

$('#news-wrap').hide();
$('li.food').on('mouseenter', function() {
    $('#news-wrap').show();
});
$('li.food').on('mouseleave', function(e) {
    if (!$(e.target).is('#news-wrap')) {
        $('#news-wrap').hide();
    }
});

这也不是：

$('#news-wrap').hide();
$('li.food').on('mouseenter', function() {
    $('#news-wrap').show();
});
$('li.food').on('mouseleave', function(e) {
    if(e.relatedTarget.id != 'news-wrap') $('#news-wrap').hide();    
});

Answer 1

我只使用CSS而不是jquery。

li.food:hover {
 #news-wrap { 
   display : block 
 }
}

将此jsfiddle example视为比较。