Javascript 更改动态生成的类的悬停行为

我的目标是设计一个具有平铺设计的电子商务店面，其中显示项目的缩略图，然后在悬停时，项目名称显示在其上方。与类似，只是它在

悬停时向上滑动，而不是简单地显示

主要的问题是，我们正在使用一个带有预打包模板的电子商务店面解决方案来显示项目，其中所有HTML都是自动生成的，并且所有项目都有一个没有css ID的css类

这是HTML，不需要的代码被编辑掉了

<td class="hoverClass">
    <--Edited out code-->
        <table class="otherClass" cellspacing="0" cellpadding="0" width="100%" style="height: 158px; width: 190px;">
          <edited out>
        </table>
        <table class="appearClass" cellspacing="0" cellpadding="0" width="100%" style="margin-bottom: 0px;">
          <edited out>
        </table>
</td>

出现的情况是，所有元素都创建了它们的ID，但所有这些自定义悬停ID都将它们的悬停绑定到最后一个
appearClass
元素。换句话说，如果我有10个项目，并且我运行了这段代码，将鼠标悬停在项目1到10上只会导致项目10上的幻灯片

如何使悬停ID与其显示ID实例绑定？
悬停项目时无法获得footArray[j]值，如果您希望使用此选项

for(var j = 0; j < x.length; j++)
{
    $("#" + thumbArray[j]).hover(function(){
        $("#"+this.id.replace("catThumb","catFoot")).slideToggle();
    });
}

悬停项目时无法获得footArray[j]值，如果希望输出，请使用此选项

for(var j = 0; j < x.length; j++)
{
    $("#" + thumbArray[j]).hover(function(){
        $("#"+this.id.replace("catThumb","catFoot")).slideToggle();
    });
}

有点像jQuery，但我认为您不需要向它们添加id（除非您需要为其他内容添加id，否则我将更新我的答案）


var hover=$（“.hoverClass”）；
$.each（悬停，函数（）{
$（this）.hover（函数（）{
变量出现=$（this.find（“.appearClass”）；
出现。滑动切换（）；
});
});
有点jQuery风格，但我认为您不需要向它们添加id（除非您需要添加其他内容，否则我将更新我的答案）


var hover=$（“.hoverClass”）；
$.each（悬停，函数（）{
$（this）.hover（函数（）{
变量出现=$（this.find（“.appearClass”）；
出现。滑动切换（）；
});
});
不要使用动态ID，而是使用类：

$('.hoverClass').hover(function(){
    $(this).find('.appearClass').slideToggle();
});

不要使用动态ID，而是使用类：

$('.hoverClass').hover(function(){
    $(this).find('.appearClass').slideToggle();
});

这是因为处理程序中存在闭包问题，但为什么不改用类呢？这是因为处理程序中存在闭包问题，但为什么不改用类呢？这一个有效！非常感谢你！因此，在接下来的几分钟内，我不再选择作为答案。K catThumb、catFoot元素在哪里，它们与b/w的关系是什么？这些是动态生成的ID。无
悬停
不是事件，您不能委派它。使用
mouseenter
和
mouseleave
instead@A.Wolff谢谢兄弟：）这一次成功了！非常感谢你！因此，在接下来的几分钟内，我不再选择作为答案。K catThumb、catFoot元素在哪里，它们与b/w的关系是什么？这些是动态生成的ID。无
悬停
不是事件，您不能委派它。使用
mouseenter
和
mouseleave
instead@A.Wolff谢谢兄弟：）@9Deuce您应该提供所有相关的HTML mrkup（未编辑）以及可能的JSFIDLE。这种解决方案比使用无用的解决方案要好IDs@A.Wolff无用的ID方法已经起作用了。巴拉昌德兰的第一个回答非常有效。Thanks@9Deuce您应该提供所有相关的HTML mrkup（未编辑）以及可能的JSFIDLE。这种解决方案比使用无用的解决方案要好IDs@A.Wolff无用的ID方法已经起作用了。巴拉昌德兰的第一个回答非常有效。谢天谢地，我没有达到预期的效果。谢谢。@9见鬼，没问题。很高兴您找到了解决方案。未达到预期结果。谢谢。@9见鬼，没问题。很高兴你找到了解决办法。
$('.hoverClass').hover(function(){
    $(this).find('.appearClass').slideToggle();
});