javascript - 如何悬停内容，排除某些 div 类

Question

我有一个示例代码，当鼠标悬停时

$(document).ready(function() {
   $("#content").mouseenter(function(e) {
      if ($(e.currentTarget).children().hasClass(".nav")) {
            console.log("Outside");
        } else {
            console.log("Inside");
        }
   }).mouseleave(function(e) {
      console.log("Outside");
   });
});

当我悬停 .nav 时出错，结果在内部

Answer 1

您不必将 . 放入 .hasClass() 中:

.hasClass("nav")

<小时/>

或者您可以尝试将选择器更改为集合选择器，例如 $('div'):

$("div").mouseenter(function(e) {
  if ($(e.currentTarget).is(".nav")) {
    console.log("Outside", e.currentTarget);
    e.stopPropagation();
  } else {
    console.log("Inside", e.currentTarget);
  }
}).mouseleave(function(e) {
  console.log("Outside");
});

#content{width:200px; height:200px; margin:30px auto; border:solid 2px red;}
.nav{width:50px; height:20px; float:right; margin:160px 0 0 0 ; border:solid 2px green;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="content">
<div class="nav"></div>
</div>