jQuery：如何检查鼠标是否在元素上

我有一个绑定mouseenter事件的延迟函数：

$(window).load(function(e) {
  var $container = $('.container');
  $container.mouseenter(function(e) {
    //do something
  });
  ...
});

问题是，当load事件触发时，鼠标可能已经在元素上，因此在mouseenter事件绑定之前。
我可以通过在页面加载处理程序的末尾添加一些代码来解决这个问题，以便一次性检查鼠标是否在元素中，并手动触发mouseenter事件：

// check if the mouse is inside $container
if(mouse is inside $container)
  $container.mouseenter();

如何检查鼠标是否位于加载事件中的元素上

我尝试了

$container.is（':hover'）

，但它不起作用。

事件正是您想要的

如果附加mouseover事件时，

.contenner

不存在（将来动态添加），则必须使用方法附加事件

$(".conteiner").live("mouseover", function() {
   alert("hovered!");
}) 

当鼠标已经在新元素出现的位置时，它也会工作。

---

对于jQuery1.7+您应该使用方法，因为.live方法已被弃用

最好的方法是获取元素的左、右、上、下偏移量，并查看鼠标位置是否位于这些值之间

第一次加载时，将鼠标放在div上。然后刷新页面（单击F5，这样就不必移动鼠标）。下次页面完全加载时，即使您没有移动鼠标，也应以“Hover！”提示

或者更简单的方法。只需对照元素的

id

检查mousemove事件的

e.target.id

，如下所示：

$(document).mousemove(function(e){
    if( e.target.id === 'hoverTest'){
        alert("Hovered!");
    }
});

---

（执行与上面相同的步骤）。

我还没有测试它，但我认为您希望这样

function checkMouseCollision(obj) {
    var offset = obj.offset();
    objX= offset.left;
    objY=offset.top;
    objW=obj.width();
    objH=obj.height();

    var mouseX = 0;
    var mouseY = 0;
    $().mousemove( function(e) {
    mouseX = e.pageX;
    mouseY = e.pageY;
    });

    if((mouseX>objX&&mouseX<objX+objW)&&(mouseY>objY&&mouseY<objY+objH)){
        alert("hovered")     
    };
};
checkCollision($(".box"))

功能检查鼠标碰撞（obj）{
var offset=obj.offset（）；
objX=偏移量。左；
objY=offset.top；
objW=obj.width（）；
objH=obj.高度（）；
var-mouseX=0；
var-mouseY=0；
$（）.mousemove（函数（e）{
mouseX=e.pageX；
mouseY=e.pageY；
});
如果（（mouseX>objX&&mouseXobjY&&mouseY）与jQuery 1.7+配合使用，您将要使用
.on（）
：

.live已被弃用。根据需要，您还可以将任何其他事件放入.on中。：hover不起作用，因为它只适用于特定元素，并且基于css

在页面完成加载之前，将此方法与偏移量检测方法结合使用，将使您达到您想要的位置。
我选择了css悬停解决方案，因为它不需要mousemove事件。
我希望有一种方法可以在不使用事件的情况下进行检查。如果页面加载时鼠标已经在某个元素上，则他
mouseover
事件不会触发。这就是问题的关键所在。你确定
mouseover
事件不会触发吗？你尝试过mouseenter和mouseleave事件吗？
$container.is（“：hover”）
–在什么方面不起作用？我担心的是它不是特别的交叉兼容（例如，它在IE7中不起作用，因为它依赖于qSA行为），但它似乎满足了我的要求…@lonesomeday:看，把鼠标放在黑盒子上，点击ctr+enter。FF8上不会触发。不过，我需要等待页面先加载，到那时鼠标可能已经在元素上了。这似乎并不能解决FF8上的问题。要清楚，如果我把鼠标放在块a上nd获取第一个悬停弹出窗口并按enter键，然后按F5（或Ctrl-F5）要刷新，即使鼠标在盒子上，我也不会再弹出一个窗口，直到我移动鼠标一点。在Chrome上对我来说很好——看起来像是另一个跨浏览器的乱七八糟。是哪一个给你造成了这样的错误？在Chrome 16.0.912.59上的FireFox 8.0在Cr-48笔记本电脑上，即使鼠标不动，它也会不断弹出警报，所以它是正确的很难测试，但我单击“不再弹出”并移动到框上，然后点击F5，直到我开始移动鼠标，它才弹出，然后它一直弹出。@Purmou：这种方法的一种变体可以工作：在mousemove中，我可以检查鼠标是否在元素上，并设置一个标志true或false。然后我可以在win中检查该标志dow.load事件处理程序。如果没有更简单的方法，我会这样做。这可能会起作用，但mousemove会被多次调用。如果可能，我希望有一种方法可以进行一次性检查：）@spb您是否考虑过使用.one（）而不是.on（）对于您的事件？有趣的是.mouseenter还是.mouseover也被弃用了？它们似乎没有.onNo那么详细，但您应该使用.on（）。与旧的弃用.live一样，即使绑定元素（此处的_元素_）是通过ajax重画的，绑定也会存在。不过，这里有一个问题，它是父元素（您调用“on”的元素）不能在页面的整个生命周期中重新绘制。因为分配给它的.on（）必须始终存在。
function checkMouseCollision(obj) {
    var offset = obj.offset();
    objX= offset.left;
    objY=offset.top;
    objW=obj.width();
    objH=obj.height();

    var mouseX = 0;
    var mouseY = 0;
    $().mousemove( function(e) {
    mouseX = e.pageX;
    mouseY = e.pageY;
    });

    if((mouseX>objX&&mouseX<objX+objW)&&(mouseY>objY&&mouseY<objY+objH)){
        alert("hovered")     
    };
};
checkCollision($(".box"))

$(document).ready(function(){
    $('body').on("mouseover", "your_element_selector_here", function() {
        // do stuff here
    });
});