Question

在关闭弹出窗口时遇到了麻烦。如果将鼠标悬停在“ .man”对象上，或者给“ .pop-up”关闭时间，那么一切都很好。但是，如果您不等到第一个“ .pop-up”淡出并悬停在另一个“ .man”上时，第一个“ .man”中的“ .pop-up”就不会淡出。要点是使每个“ .pop-up”彼此独立地淡入和淡出。提前致谢！

let timeout,
    id;
$(".man").mouseenter(function() {
    id = $(this).attr('data-id');
    $('.pop-up-' + id).fadeIn(400);
})
$(".man").mouseleave(function() {
    id = $(this).attr('data-id');
    timeout = setTimeout(function() {
        $('.pop-up-' + id).fadeOut(400);
    }, 2000);
})
$(".pop-up-" + id).mouseenter(function() {
    clearTimeout(timeout);
})
$(".pop-up-" + id).mouseleave(function() {
    $(this).fadeOut(400);
})

Answer 1

我认为该问题是由于您的全局ID变量引起的。您应该分解淡入淡出，然后淡入一个将id作为参数接受的可调用函数。然后将鼠标悬停并退出，然后按名称调用函数。应该将id变量传递到要使用的函数中，以消除全局变量。像这样的东西。

function fadeIn(var id) {
    $('.pop-up-' + id).fadeIn(400);
}

$(".man").mouseenter(fadeIn(id))

弹出窗口错误

1 个答案: