Question

我对javascript很新，并且遇到了以下问题。我正在尝试将一个变量从1000减少到0，同时将鼠标悬停在一个元素上。如果鼠标离开元素，变量也应重置为1000。

经过一些研究后，我得到了大部分工作，但我无法弄清楚如何让变量达到0后setIntervall停止计数。这是我在查看stackoverflow后看到的。

var f = 1000, intervalId;
if (f > 0) 
{
    $(".thumb").hover(function () 
    {
        $this = $(this);
        intervalId = setInterval(function () 
        {
            $this.text(f--);
        }, 1);
    }, function () 
    {
        clearInterval(intervalId);
        f = 1000;
    });
} 
else 
{
    clearInterval(intervalId);
}

我很确定这是我在这里犯的一个愚蠢的错误，因为我刚接触编程，但如果有人能指出我正确的方向，我将非常感谢你的帮助。

FIDDLE around with the code

Answer 1

演示：http://jsfiddle.net/DVPcA/

var f = 1000;
var interval;

$(".thumb").hover(function () {
  $this = $(this);

  interval = setInterval(function () {
    if (f > 0) {
      $this.text(f--);
    } else {
      clearInterval(interval);
    }
  }, 1);
}, function () {
  clearInterval(interval);
  f = 1000;
});

Answer 2

更新了小提琴

http://jsfiddle.net/n74VW/56/

替换此行

$this.text(f--);

带

$this.text(f>0?f--:f=0);

鼠标悬停时启动setInterval //在mouseleave上重置//在1秒后停止setInterval

2 个答案: