Как сохранить значение INPUT в переменной?

Question

Как сохранить значение INPUT в переменной, чтобы не писать много повторяющегося кода?

как var input = $ (this) .val ();

full пример

<div id="form">
    1. <input type="text" value="title" />
    2. <input type="text" value="value" />
</div>

$(function(){
  $('#form input:eq(0)').bind({
    focus: function(){
       if($(this).val()=='title'){
            $(this).val('');
        }
     },
     blur: function(){
       if($(this).val() == ''){
          $(this).val('title');
        }
     }
  });

  $('#form input:eq(1)').bind({
    focus: function(){
      if($(this).val()=='value'){
         $(this).val('');
      }
    },
     blur: function(){
        if($(this).val() == ''){
           $(this).val('value');
        }
    }
  });
});

Answer 1

Чтобы выполнить то, что вы хотите, я бы предложил использовать атрибут HTML5 placeholder.С помощью Modernizr мы можем определить поддержку этой функции в браузере, а с помощью этого простого куска кода мы можем заставить его работать даже для браузеров, которые не поддерживают placeholder.

if(!Modernizr.input.placeholder){
    var input = $('input[type="text"]');

    input.focus(function(){
        if(this.value === this.getAttribute('placeHolder')) this.value = '';
    }).blur(function(){
        if(this.value === '') this.value = this.getAttribute('placeHolder');
    }).blur();
}

См. Демонстрационную версиюэто здесь: http://www.jsfiddle.net/yijiang/cTDsL/1

Answer 2

Я не совсем уверен, что вы спрашиваете, но этот рефакторинг будет работать для переключения значения.РЕДАКТИРОВАТЬ: добавлен атрибут по умолчанию для элементов HTML и сокращенный JQuery (все еще читаемый хотя) http://jsfiddle.net/UmZeZ/

<div id="form">
    1. <input type="text" value="title" default="title" />
    2. <input type="text" value="value" default="value" />
</div>


$(function() {
    $('#form input').bind('focus blur', function() {
        var value = $(this).attr('default');
        if ($(this).attr('value') == value) {
            $(this).attr('value', '');
        } else if ($(this).attr('value') === '') {
            $(this).attr('value', value);
        }
    });
});

Answer 3

Вот мое решение.Я бы работал с любым полем, которое имеет class = "set-default"

Оформить рабочий пример

Вот код:

$(function(){
    $('.set-default').bind({
    focus: function(){
        if(typeof($(this).data('def')) == 'undefined'){
               $(this).data('def', this.value)
        }
        if(this.value == $(this).data('def')){
           this.value = '';
        }
     },
     blur: function(){
       if(this.value == ''){
          this.value = $(this).data('def');
       }
     }
    })
});

в основном все поля, которые имеют класс set-default, будут работать как вам угодно.Вы всегда можете изменить селектор на $ ('# form input'), но я думаю, что это бесполезно.

HTH