タイムアウト機能のキャンセル/停止

Question

私は、ボタンをクリックしたときにフェードアウトするjavascipt（jQuery）を持っていて、タイムアウト機能を使って5秒後に再びフェードアウトします。それは正常に動作しますが、ユーザがタイムアウト内のfadeOut関数が実行される前にボタンを再度クリックすると、タイムアウトが必要になり、本来はやり直す必要があります。

私はこの作業を行うことはできませんが、最初にタイムアウトをクリアする関数を実行することになると思います。

$('button').on('click', function() { 

    //need function here to stop the timeout if running 

    $("#myDiv").fadeIn(slow); 

    setTimeout(function(){ 
    $("#myDiv").fadeOut(slow); 
    }, 5000); 

}); 

Answer 1

すでに設定されている場合は、タイムアウトをクリアする必要があります。

var to = null; 
$('button').on('click', function() { 

    if(to){ 
    clearTimeout(to); 
    } 
    //need function here to stop the timeout if running 

    $("#myDiv").fadeIn(slow); 

    to = setTimeout(function(){ 
    $("#myDiv").fadeOut(slow); 
    }, 5000); 

}); 

をclearTimeout()機能は、ユーザーが最初のタイムアウトが削除されたボタンを二回クリックしてくださいので、もしタイムアウトを削除して、唯一の番目のインスタンスなります実行される。

あなたはこれだけではjQueryのAPIメソッドに建て使用して行うことができます

Answer 2

：

• stop()

• delay()：

  $('button').on('click', function() { 
      $("#myDiv") 
       .stop(true,true) // resets current animation queue 
       .fadeIn('slow') 
       .delay(5000)// delays anything in queue 
       .fadeOut('slow'); 
  }); 
  

  が

  参考文献を読むために少し簡単なものにします

DEMO