Javascript 在JS中清除计时器的问题

我有一些使用PHP动态创建的元素。我希望用户将鼠标悬停在图标上，并显示相应的元素。当鼠标离开图标时，我希望计时器启动，然后隐藏元素。如果鼠标进入显示的元素，我想清除计时器。当鼠标离开该元素时，我希望计时器再次启动

我很难弄清楚这一点，我无法弄清楚为什么计时器不能清除。下面所有jQuery都在

文档中。就绪

jQuery

var $infoIcon = $('.fa-info-circle');
var $trackListing = $('track-listing');
var timer;

// Show listing on hover
$infoIcon.on('mouseenter', function(){
    $(this).next('.track-listing').fadeIn();
    clearTimeout(timer);

// Start timer when exiting the info icon
}).on('mouseleave', function(){
    timer = setTimeout(function(){
        $('.track-listing').fadeOut();
    }, 2000);
});

// Kill timer when entering listing box
$trackListing.on('mouseenter', function(){
    clearTimeout(timer);

// Start timer when leaving listing box    
}).on('mouseleave', function(){
    timer = setTimeout(function(){
        $('.track-listing').fadeOut();
    }, 2000);
});

---

如果你需要PHP，请告诉我。此外，我还尝试过设置

var计时器

在

文档之外。准备好作为全局变量，我会得到相同的结果。
尝试使用两个不同的计时器。一个用于
$trackListing
，另一个用于
$infoIcon
如果在页面加载后插入元素，请尝试按如下方式绑定它们：

$(document).on(event, '.selector', function(){});

此
委托
事件
此选择器不正确-您缺少一个前导的
或
#
：
var$trackListing=$（'track-listing'）您提到您正在动态添加元素。运行此代码时，DOM中是否同时存在
$infoIcon
和
$trackListing
？如果元素是动态创建的，则需要确保在元素添加到文档后绑定事件，而不仅仅是在文档readyI changed
var timer至
var定时器=0
还修复了错误选择器的错误，它现在可以正常工作。我不知道答案去了哪里。。。它似乎已经消失了。我还将在页面加载后绑定事件。谢谢大家的帮助！不是因为这是我的答案，而是我很确定您没有绑定选择器。在这种情况下，初始化变量不会改变行为。