jquery輸入自動調整大小

Question

我有一些jquery，可以順利調整點擊文本輸入的大小。除了一個小問題，當你點擊遠離該字段時，這一切都可以正常工作，字段重置。

煩人的部分是當你輸入字段，然後點擊離開字段，你輸入的所有數據被刪除。

如何讓它不清除用戶點擊時輸入的文本？

繼承人jsfiddle

和

這裏是jQuery的：

var inputWdith = '250px'; 
    var inputWdithReturn = '140px';  
    $(document).ready(function() { 
     $('input').focus(function(){ 

      $(this).val(function() { 
       $(this).val(''); 
      }); 

      $(this).animate({ 
       width: inputWdith 
      }, 400) 
     }); 

     $('input').blur(function(){ 
      $(this).val('Enter info...'); 
      $(this).animate({ 
       width: inputWdithReturn 
      }, 500) 
     }); 
    }); 

Answer 1

工作JS提琴：http://jsfiddle.net/NcwZA/1/

$('input').focus(function(){ 
    if($(this).val()=='Enter info...'){ 
     $(this).val(''); 
    } 

    //animate the box 
    $(this).animate({ 
     width: inputWdith 
    }, 400) 
}); 

$('input').blur(function(){ 
    if($(this).val()==''){ 
     $(this).val('Enter info...'); 
    } 

    $(this).animate({ 
     width: inputWdithReturn 
    }, 500) 

}); 

Answer 2

你只需要做模糊的東西，如果該字段爲空。

$('input').blur(function(){ 
    if ($(this).is(":empty")){ 
     $(this).val("Enter info...") 
      .animate({ 
       width: inputWdithReturn 
      }, 500); 
    } 
}); 

Answer 3

問題出在blur事件。沒有條件不替換用戶輸入的內容。