如果鼠标悬停在弹出窗口上，jquery mouseover 不隐藏元素答案

【问题标题】：jquery mouseover not to hide element if the mouse is over popup window如果鼠标悬停在弹出窗口上，jquery mouseover 不隐藏元素
【发布时间】：2023-03-17 18:43:02
【问题描述】：

我的元素很少，通过在每个元素上移动鼠标，在鼠标在每个元素上花费几秒钟后，应该会出现弹出窗口。这是我通过以下脚本完成的

var timeOutUserInfo;
$('a[datatype=popupAboutUser]').live({
    mouseenter: function() {
        timeOutUserInfo = setTimeout(function(){
            $('#popupUserInfo').show();
        }, 1000);
        return false;
    },
    mouseleave: function (e) {
        clearTimeout(timeOutUserInfo);
        $('#popupUserInfo').fadeOut(250);
    }
});

问题是，如果用户应该在#popupUserInfo 上移动鼠标，但只要他这样做，弹出窗口就会隐藏。我尝试了一些方法来检查鼠标是否在该弹出窗口上，如果没有 - 隐藏它，但无法这样做。

有解决办法吗？

【问题讨论】：

标签： jquery hover mouseevent mouseover

【解决方案1】：

试试这个...

<style type="text/css">
a.showinfo{
display:inline-block;
position:relative;
}

div.popupUserInfo{
width:100px;
height:100px;
position:absolute;
right:-100px;
top:0;
display:none;
}
</style>

<a href="whatever.com" class="showinfo">
  <div class="popupUserInfo">some user info here</div>
</a>

<script type="text/javascript">
  $(document).ready(function(){
    $(".showinfo").hover(function(){
        $(this).children(".popupUserInfo").show();
      },function(){
        $(this).children(".popupUserInfo").hide();
    });
  });
</script>

【讨论】：