Mouseenter/mouseleave多个div
Mouseenter/mouseleave多个div
提问于 2012-10-04 23:07:56
我在一行中有三个div，在一个页面上有类，例如.class1，.class2，.class3。
当用户鼠标进入我想显示其他divA (divA和divB)的divA时，问题是我可以在函数中有多个divA吗？
这是我到目前为止所拥有的一个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等，但没有找到joy，也试过.class1 || .class2等，但也没有找到joy
这个是可能的吗？
回答 2
Stack Overflow用户
回答已采纳
发布于 2012-10-04 23:10:26
在jQuery中，您可以使用,分隔选择器，因此在您的示例中，类似于".class1, .class2"等。
然后，jQuery将查找与这些选择器中的一个或多个匹配的元素。
更新：
您可以通过将两个事件绑定到相同的回调来缩短代码，并使用slideToggle()：
$(function() {
$("body").on("mouseenter mouseleave", ".class1, .class2, .class3", function ()
{
$(this).children(".divA, .divB").slideToggle();
});
});我还没有尝试过，但是在功能上应该等同于你的代码。只是短了一点。
Stack Overflow用户
发布于 2012-10-04 23:10:11
您可以简单地执行以下操作
$(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();
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/12730322
复制相关文章
相似问题
腾讯云开发者
