防止第二次啓動的功能，如果第一次沒有完成

我創建了一個代碼，當一個加速度（像引力一樣工作）時拋出一個元素，並在changed_lenght達到零時下降;防止第二次啓動的功能，如果第一次沒有完成

「mouseenter」正在觸發此功能。當鼠標離開並快速進入時，該功能會一遍又一遍地重新開始，而不會停止前面的那個，所以看起來很糟糕。

我不知道是否有任何方法來檢查是否在開始函數之前先前已經結束。或者其他可以幫助我的解決方案？

這裏是我的JS代碼：

$('#outher').mouseenter(function moveone(){ 

    var t = 0; 
    var v = 20; 
    var p = 275; 
    var a = 5; 
    var moveoneint = setInterval(jump, 50); 
    function jump(){ 
      t++; 
      x = (v*t) - (0.5 * a * t * t); 
      p = (p - x); 
      if(x <= 0){ 
       clearInterval(moveoneint); 
       t = 0; 
       var movetwo = setInterval(fall, 50); 
       function fall(){ 
        t++; 
        x = (0.5 * a * t * t); 
        p = (p + x); 
        document.getElementById('inner').style.top = p + 'px'; 
        if(p >= 275){ 
         clearInterval(movetwo); 
        } 
       } 


      } 
      else{    
       document.getElementById('inner').style.top = p + 'px';  
     } 
    } 
});

，這裏是一個小提琴：

http://jsfiddle.net/ctarimli/TJte8/

來源

2014-04-03 ctarimli

你應該考慮使用jQuery'動畫（）'方法，加上'停止（）'方法和緩解作用（本身不支持，但是很多插件hanlde它） –

如何用「動畫」方法實現這種重力效應？因爲我知道動畫使用相同的速度，但我希望它變得越來越慢，並得到更快的下降 – ctarimli

尋找緩解效應，這基本上是你在尋找 –

您可以簡單地刪除mouseenter處理程序，直到動畫完成。

JSFIDDLE

基本上，

var $outher = $('#outher'); 

var onMouseEnter = function() { 
    $outher.off('mouseenter', onMouseEnter); 

    // do all your animation logic, and once complete... 
    $outher.on('mouseenter', onMouseEnter); 
}; 

$outher.on('mouseenter', onMouseEnter);

來源

2014-04-03 14:19:46 jmar777

我認爲這就是我正在尋找的東西，實際上我的代碼比我在這裏寫的要長。我會在我的代碼中嘗試。我會寫出結果 – ctarimli

使用jQuery is檢查，如果DIV是動畫

if(!$('.inner').is(':animated')) 
{ 
    //Your code 
}

來源

2014-04-03 14:17:29 demonofthemist

如果您對第三方庫代碼開放，那麼throttle /debounce將執行您想要的操作。請注意，該頁面提到jQuery，但該庫實際上並不需要jQuery。

特別是，查看$ .throttle方法的示例。

來源

2014-04-03 14:18:51 dgvid

@ jmar777的建議幫助我現在，但我會看看你的也是。 – ctarimli

防止第二次啓動的功能，如果第一次沒有完成

回答

相關問題