ilove581314 2011-11-07 16:11 采纳率: 0%
浏览 1327
已采纳

如何判断鼠标当前位置是否在一个div内部?

一个按钮(class="myqiehuan"),一个初始隐藏的div(class="qiehuan")
需求:
1.当鼠标放到(不是点击事件)按钮上时,显示div,当鼠标离开按钮时,隐藏div
2.当div被1中的事件触发而显示时,当鼠标在这个div内部时,继续显示这个div,当鼠标离开这个div时,隐藏div
JQuery:
$(".qiehuan").hover(function(){//对div的处理
$(this).show();
},function(){
$(this).hide();
});
$(".myqiehuan").hover(function(){//对按钮的处理
$(this).parent().children(".qiehuan").show();
},function(){
$(this).parent().children(".qiehuan").hide();

});
遇到的问题:
这个按钮和div之间可能有一条缝,使得将鼠标从按钮移到显示的div时,上面的代码交替执行,使得div的显示会闪一下,好像是:出了按钮它立即隐藏而进入div时又立即显示,所以会使得这个div跳动一下,如何才能解决这个问题?
当然,如果有别的思路也可以,不一定非要判断出鼠标当前位置是否在这个div内部?
比较急,谢谢!

  • 写回答

3条回答 默认 最新

  • ayling520 2011-11-07 16:49
    关注

    这个我也做过这个功能。

    $(".qiehuan").hover(function(){//对div的处理

    ${this}.addClass("hover"); // 当鼠标进入这个DIV的时候,给加一个class样式。

    $(this).show();
    },function(){
    ${this}.removeClass("hover");// 当鼠标离开这个DIV的时候,给删除一个class样式
    $(this).hide();
    });

    $(".myqiehuan").hover(function(){//对按钮的处理
    $(this).parent().children(".qiehuan").show();
    },function(){
    setTimeout(function(){
    var divThis = $(this).parent().children(".qiehuan");
    if (!divThis.hasClass('hover'))
    {
    divThis.hide();
    }
    }, 100); // 延迟,这个看你多久合适。
    });

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(2条)

报告相同问题?

悬赏问题

  • ¥15 jupyterthemes 设置完毕后没有效果
  • ¥15 matlab图像高斯低通滤波
  • ¥15 针对曲面部件的制孔路径规划,大家有什么思路吗
  • ¥15 钢筋实图交点识别,机器视觉代码
  • ¥15 如何在Linux系统中,但是在window系统上idea里面可以正常运行?(相关搜索:jar包)
  • ¥50 400g qsfp 光模块iphy方案
  • ¥15 两块ADC0804用proteus仿真时,出现异常
  • ¥15 关于风控系统,如何去选择
  • ¥15 这款软件是什么?需要能满足我的需求
  • ¥15 SpringSecurityOauth2登陆前后request不一致