jQuery實作設定、移除文字方塊預設值功能_jquery

jQuery實作的文字方塊預設值感應滑鼠動作:

本章節介紹如何利用jQuery實作文字方塊預設值感應滑鼠動作的功能。
例如當文字方塊取得滑鼠焦點的時候，預設值會被清空，當文字方塊沒有輸入內容，滑鼠焦點離開的時候，又會恢復到預設值。
程式碼實例:

複製程式碼 程式碼如下:

上面的程式碼實現了我們的要求，以下簡單介紹一下它的實作原理：

非常的簡單，就是為文字方塊註冊focus和blur事件處理函數，當文字方塊取得焦點的時候，如果文字方塊的內容和預設值相同，那麼就會清空文字方塊，當焦點離開文字方塊的時候，如果文字方塊的內容為空，那麼就會恢復到預設值。

或使用下面的程式碼：

複製程式碼 程式碼如下:

$('.default-value').each(function() {

       var default_value = this.value;

       $(this).focus(function(){
               if(this.value == default_value) {
                       this.value = '';
               }
       });

       $(this).blur(function(){
               if(this.value == '') {
                       this.value = default_value;
               }
       });

});