jQuery在用戶交互中隱藏和顯示標籤

Question

當用戶與文本框交互時，我有以下隱藏和顯示標籤的jQuery代碼。一些方案：

1）用戶焦點，標籤應爲50％的不透明度
2.）用戶類型，標籤應爲0％的不透明度
3.）用戶刪除所有的內容，但仍集中，標籤應是在50％的不透明度
4.）用戶刪除所有的內容和焦點，標籤應爲0％的不透明度
5.）用戶類型的內容和焦點，標籤應爲0％的不透明度

因此概括地說如果輸入有價值，那麼沒有標籤，如果集中在50％，如果沒有價值，則在100％不透明。

的代碼如下：

  $('label.placeholder').each(function() { 

       var label = $(this); 

       var input = label.next('input'); 

       label.click(function() 
       { 
        input.focus(); 
       }); 

       input.bind('keyup keydown focus click check change paste copy', function() 
       { 
        if (input.val().length > 0) 
        { 
         label.animate({ opacity: 0 }, 200); 
        } 
        else 
        { 
         label.animate({ opacity: .6 }, 200); 
        } 

       }).bind('blur', function() 
       { 
        label.animate({ opacity: 1 }, 200); 

       }); 

的問題是，雖然如果在快速用戶類型或做多的操作，然後它會導致褪色背部或縮小需要一段時間，因爲它有爲每個交互回調檢查每個場景的所有檢查。一個很好的例子是輸入一個文本的負載，然後再次刪除它，你會看到它需要一段時間來重新顯示標籤。

有關如何防止這種情況的任何想法？ http://jsfiddle.net/fFGM7/

Answer 1

在所有動畫之前使用.stop()。我相信會解決它：

$(label).stop().animate({ opacity: 1 }, 200);