检测鼠标是否在元素上

Question

如果鼠标悬停在div上，如何获得非常简单的true / false语句event = true else event = false

  var test = $("#main-nav").on("mouseenter", function (e) {
    e.preventDefault();
    console.log(e.preventDefault());
    return true;
});

if (test === true) {
   //do something
} else {
   //something different
}

Answer 1

如果我正确理解您的问题：

if($("#main-nav").is(":hover")) {
   //do something
}else{
   //something different
}

用伪代码：

if the cursor is over #main-nav
    do something
if it's not
    do something else

---

如果要始终设置test ：

var test = false;
$("#main-nav").on("mouseenter", function(e){
    e.preventDefault();
    test = true;
}).on("mouseleave", function(e){
    e.preventDefault();
    test = false;
});

这条路，

if(test === true) {
   //do something
}else{
   //something different
}

将始终有效。

Answer 2

您可以使用以下布尔值（ true / false ）进行不断更新：

var hovering;
$("#main-nav").mouseenter(function(){
    hovering = true;
});
$("#main-nav").mouseleave(function(){
    hovering = false;
});

因此，无论何时调用它，它都会告诉您鼠标是否在div内：

if (hovering){
    // mouse within div
} else {
    // mouse not within div
}

Answer 3

如果您确实需要将其作为变量：

var test = false;
$("#main-nav").on("mouseenter", function (e) {
    test = true;
});
$("#main-nav").on("mouseout", function (e) {
    test = false;
}); 

//....

if (test === true) {
   //do something
} else {
   //something different
}