Javascript 设置/清除间隔问题

嗨

我使用下面的代码来显示li元素内部的链接。约束是，一旦鼠标进入li元素，如果它停留在3sec之内，那么它需要显示。一旦我离开了李元素，非物质性就应该隐藏起来。为此，我使用：

var showTimeOut;
var thisElement

$('.user-list li').live('mouseover',function(){

    thisElement = $(this).children('a.copier-link');

    showTimeOut = setInterval(function(){
        thisElement.css({'display':'block'});
    },3000);
})

$('.user-list li').live('mouseleave',function(){
    clearInterval(showTimeOut);
    thisElement.hide();
})

很好。但问题是，当我在一秒钟内跨越li元素时，即使间隔也在调用并显示链接。但我只需要展示，如果我待在3秒之内，它需要在之后隐藏在那里，我会再次回到3秒

我的代码有什么问题吗？还有谁能给我最好的建议吗

谢谢。

也许这就是你要找的

hoverIntent是一个尝试 要确定用户的意图。。。喜欢 一个水晶球，只有鼠标 移动它工作起来像（而且是） 派生自）jQuery的内置悬停。 然而，不是立即 调用onMouseOver函数，它 等待用户的鼠标速度减慢 在打电话之前，请记下足够的信息

也许这就是你要找的

hoverIntent是一个尝试 要确定用户的意图。。。喜欢 一个水晶球，只有鼠标 移动它工作起来像（而且是） 派生自）jQuery的内置悬停。 然而，不是立即 调用onMouseOver函数，它 等待用户的鼠标速度减慢 在打电话之前，请记下足够的信息

---

这只是猜测，但可能与您使用的是

mouseover

而不是

mouseenter

有关<如果

li

元素中有子元素，则code>mouseover可以多次触发，这将多次设置间隔并覆盖

showTimeout

变量的值。这意味着当

mouseleave

触发时，只会清除最后一个要设置的间隔

尝试将

mouseover

事件改为

mouseenter

。我也会考虑将<代码> SETIFATE < /COD>更改为<代码> SETTIMEOUT，因为<代码> SETIFATION/<代码>将设置一个计时器来运行一个函数，每3秒重复一次，不必要地应用<代码> .CSS（）<代码>。code>setTimeout只调用函数一次

---

另一个想法是总是在

setTimeout

之前调用

cleartimout

，这样您就知道两个计时器不能同时运行：

clearTimeout(showTimeout);
showTimeOut = setTimeout(function(){
    thisElement.css({'display':'block'});
},3000);    

---

这只是猜测，但可能与您使用的是

mouseover

而不是

mouseenter

有关<如果

li

元素中有子元素，则code>mouseover可以多次触发，这将多次设置间隔并覆盖

showTimeout

变量的值。这意味着当

mouseleave

触发时，只会清除最后一个要设置的间隔

尝试将

mouseover

事件改为

mouseenter

。我也会考虑将<代码> SETIFATE < /COD>更改为<代码> SETTIMEOUT，因为<代码> SETIFATION/<代码>将设置一个计时器来运行一个函数，每3秒重复一次，不必要地应用<代码> .CSS（）<代码>。code>setTimeout只调用函数一次

---

另一个想法是总是在

setTimeout

之前调用

cleartimout

，这样您就知道两个计时器不能同时运行：

clearTimeout(showTimeout);
showTimeOut = setTimeout(function(){
    thisElement.css({'display':'block'});
},3000);    

---

你能重新标记这个来显示你使用的是什么语言吗？我对语言/框架做了一些假设，并相应地修改了标记@3gwebtrain，如果证明标签不正确，请更改标签。是否需要在此处使用setInterval（每3秒重复一次），setTimeout是否更合适？能否重新标记以显示您使用的语言？我对语言/框架进行了假设，并相应地更改了标签@3gwebtrain，如果证明标签不正确，请更改标签。是否需要在此处使用setInterval（每3秒重复一次），setTimeout是否更合适？谢谢，我现在已将代码更改为这样。。var显示超时；var thiseelement$（'.user list li'）.live（'mouseenter'，function（）{thiseelement=$（this）.children（'a.copier-link'）；showTimeOut=setTimeout（function（）{thiseelement.css（{'display'：'block'}）；}，3000）；}）（（'user list li'）.live（'mouseleave'，function（）{clearInterval（setTimeout）；thiseelement.hide（）；}）但问题仍然存在，当我将鼠标移到函数调用的li元素中的任何一个，并使链接可见时。。有什么帮助吗？@3gwebtrain:在mouseleave处理程序中，您有

clearInterval（setTimeout）

，这应该是

clearTimeout（showTimer）

。另外，在设置超时之前，请尝试清除超时，因为这将排除计时器的任何重复。谢谢，我现在已将代码更改为这样。。var显示超时；var thiseelement$（'.user list li'）.live（'mouseenter'，function（）{thiseelement=$（this）.children（'a.copier-link'）；showTimeOut=setTimeout（function（）{thiseelement.css（{'display'：'block'}）；}，3000）；}）（（'user list li'）.live（'mouseleave'，function（）{clearInterval（setTimeout）；thiseelement.hide（）；}）但问题仍然存在，当我将鼠标移到函数调用的li元素中的任何一个，并使链接可见时。。有什么帮助吗？@3gwebtrain:在mouseleave处理程序中，您有

clearInterval（setTimeout）

，这应该是

clearTimeout（showTimer）

。另外，在设置超时之前，请尝试清除超时，因为这将排除任何计时器的重复。如果您使用jQuery，我看不到任何不使用此插件的原因，因为它完全可以满足您的需要。如果您使用jQuery，我看不到任何不使用此插件的原因，因为它完全可以满足您的需要。