我需要延遲當我改變一些文字

Question

我需要一個提示！我想延遲一些文本。與.delay它不工作，因爲它不是一個隊列。然後我用.setTimeout試了一下。這工作，但只適用於一個文本框。當我添加另一個時，它不能正常工作。誰能幫我？

下面的代碼：

$('#text-box1').hover(function() { 
    $('#text-box1').text("The text changed!"); 
}, function() { 
    $('#text-box1').text("The previous Text"); 
}); 

Answer 1

你需要知道，如果有一些超時工作，先停止它。這裏是您的解決方案：

$(function(){ 
    var to; 
    var $tb1 = $('#text-box1'); 

    $tb1.on('mouseenter', function(){ 
     if(to !== undefined) return; 
     var $this = $(this); 
     to = setTimeout(function(){ 
      $this.text('The text changed!'); 
      to = undefined; 
     }, 500); 

    }).on('mouseleave', function(){ 
     if(to !== undefined) return; 
     var $this = $(this); 
     to = setTimeout(function(){ 
      $this.text('The previous Text'); 
      to = undefined; 
     }, 500); 
    }); 
}); 

Check jsFiddle