jQuery：动态元素，带有计时器淡出

Question

我的网站上有一个基本的消息系统，它将消息排队/附加到浮动在页面顶部的div中。 每条消息应在X秒钟后消失，但如果将鼠标悬停在该消息上将暂停，则其消失时间将消失，然后在鼠标离开时恢复。

因此，我尝试添加一个div并为其添加一个计时器以使其淡出，但在mouseneter上，它将暂停该淡出，而在mouseleave上，它将恢复它。 还有一个关闭按钮，将立即使其消失。

我已经尝试过delay()但是没有办法控制它，而且似乎无法使用setTimeout()来解决问题，因为我不知道如何将计时器附加到创建的div上。

Answer 1

您需要将计时器id添加到全局范围内的对象（例如window.timers ，并且在鼠标悬停时，对所有活动计时器进行迭代，将它们window.timers clearTimeout()并保存timeRemaining值-与DOM准备就绪的区别时间戳和该鼠标悬停事件的时间戳。 鼠标移出时，将所有计时器重新设置为timeRemaining值，而不是初始时间值。