Javascript Mouseenter/mouseleave多个div

我有三个div排成一行，每一页都有一个类，例如，class1，class2，class3

当用户鼠标输入我想要显示其他div（divA和divB）的任何一个div时，问题是我可以在函数中有多个div吗

这就是我到目前为止所做的，对于一个工作非常出色的div来说：

$(document).ready(function(){
$("body").on("mouseenter", ".class1", function ()
{
$(this).children(".divA").slideDown();
$(this).children(".divB").slideDown();
});

$("body").on("mouseleave", ".class1", function ()
{
$(this).children(".divA").slideUp();
$(this).children(".divB").slideUp();
});
});

但是，如果用户输入.class1、.class2或.class3，我希望效果发生

三次没有类似的功能

我试过了.class1&.class2等，但没有乐趣，也没有.class1 | |.class2等，但也没有乐趣

这可能吗？

你可以简单地做

$(document).ready(function(){
$("body").on("mouseenter", ".class1, .class2, .class3", function ()
{
$(this).children(".divA").slideDown();
$(this).children(".divB").slideDown();
});

$("body").on("mouseleave", ".class1, .class2, .class3", function ()
{
$(this).children(".divA").slideUp();
$(this).children(".divB").slideUp();
});
});

---

在jQuery中，您可以使用

，

分隔选择器，因此在您的示例中，类似于

“.class1、.class2”

等等

然后，jQuery将查找与一个或多个选择器匹配的元素

更新：

通过将两个事件绑定到同一个回调，您可以稍微缩短代码，并改用：

---

我还没有试过，但这在功能上应该与您的代码相当。稍微短一点。

@DarrenSweeney jQuery之美；）@DarrenSweeney看到了我更新的答案，在这里我简化了你的代码。

$(function() {
   $("body").on("mouseenter mouseleave", ".class1, .class2, .class3", function ()
   {
       $(this).children(".divA, .divB").slideToggle();
   });
});