Javascript 嗨，我有一个容器，里面有很多盒子图片

我有一个容器，包含许多盒子图像。当我将鼠标悬停在图像上方时，图像隐藏框将显示在图像上。但是当我使用这个脚本时，所有的盒子都打开了

$(".conbx img").mouseover(function() {
    $(".topics-active").show()
});

$(".conbx img").mouseout(function() {
    $(".topics-active").hide()
});

---

您必须获取当前元素的同级

$(".conbx img").mouseover(function() {
    $(this).siblings(".topics-active").show()
});

演示：

优化

$(".conbx").on('mouseover', 'img', function() {
    $(this).siblings(".topics-active").show()
}).on('mouseout', 'img', function() {
    $(".topics-active").hide()
});

或者，您也可以使用
悬停
：

$(".conbx img").hover(function() {
    $(this).siblings(".topics-active").show()
}, function() {
    $(".topics-active").hide()
});

用这个

$(".conbx img").mouseover(function() {
    $(this).next('.topics-active').show()
});

$(".conbx img").mouseout(function() {
    $(this).next('.topics-active').hide()
});

用这个

$(".conbx img").mouseover(function(){
     $(this).closest('.fltlft').find(".topics-active").show();
});
$(".conbx img").mouseout(function(){
     $(this).closest('.fltlft').find(".topics-active").hide();
});


或者您可以只使用css而不需要jquery

.fltlft:hover .topics-active{
    display: block;
}