javascript - ClearInterval() 不会停止我的旋转功能

Question

我正在使用 jQuery Rotate 插件，将图像旋转 90 度动画，然后停止旋转。

我的问题是它不会停止旋转，即使在调用 clearInterval(); 之后也是如此。

$(document).ready(function() {
    var finalAngle;
    var intval = setInterval(function func() 
    {
      $("#myimg").rotate(1);
      if(typeof func.angle == 'undefined' )
      {
           func.angle = 0;
      }

      func.angle += 1;

      finalAngle = func.angle;

    }, 1);

    if(finalAngle == 90)
    {
      clearInterval(intval);
    }
});

基本上我所做的只是（静态地）计算角度，一旦达到 90，就调用 clearInterval 函数。我不得不引入另一个变量来存储计数，以便我可以在 setInterval 函数之外访问它。

Answer 1

这简单。setInterval被调用然后条件finalAngle被评估，一毫秒后你的旋转函数被调用。因此在90clearInterval时从不调用。finalAngle

此代码应该适合您：

$(document).ready(function() {

    var intval = setInterval(function func() 
    {
      $("#myimg").rotate(1);
      if(typeof func.angle == 'undefined' )
      {
           func.angle = 0;
      }

      func.angle += 1;

      if (func.angle == 90)
      {
        clearInterval(intval);
      }    
    }, 1);  
});

Answer 2

该if语句执行一次。试试这个？

$(document).ready(function() {
    var finalAngle;
    var intval = setInterval(function func() 
    {
      $("#myimg").rotate(1);
      if(typeof func.angle == 'undefined' )
      {
           func.angle = 0;
      }

      func.angle += 1;
      finalAngle = func.angle;
      if(finalAngle == 90)
      {
          clearInterval(intval);
      }


    }, 1);


});

虽然我不明白为什么你不能逃脱...

$(document).ready(function() {
    var finalAngle=0;
    var intval = setInterval(function func() 
    {
      $("#myimg").rotate(1);

      finalAngle++;

      if(finalAngle == 90)
      {
          clearInterval(intval);
      }


    }, 1);


});