1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
var origValue = [];
$('input.remember').each ( function (currentIndex){
   origValue.push ( $(this).val () );
   $(this).focus ( function (){
      $(this).removeClass("unfocused");
      var defaultText = $(this).val();
      if ( $(this).val () == origValue [ currentIndex ] ){
         $(this).val('');
      }
 
      $(this).blur(function(){
         var userInput = $(this).val();
         if (userInput == ''){
            $(this).val(defaultText);
            $(this).addClass("unfocused");
         }
      });
   });
});

jQuery сниппет создает для полей ввода подсказки, которые исчезают при фокусе на поле ввода и возвращаются при потере фокуса, если пользователь ничего не ввел. Для работы сниппета необходимо задать полям, значение которых необходимо сохранить, класс ‘remember’. Так же полям можно задать класс ‘unfocused’, чтобы в css менять оформление полей при фокусе на них.

источник: css-tricks.com

Оставьте свой комментарий