如何将INPUT的值保存在变量中？

Question

如何将INPUT的值保存在变量中而不编写大量重复代码？

就像 var input = $(this).val();

完整示例

<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

我不太确定你在问什么，但这种重构将有助于切换值。编辑：向 html 元素添加默认属性并缩短 jQuery（但仍然可读） http://jsfiddle.net/UmZeZ/< /a>

<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 2

为了实现你想要的，我建议使用 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/yijian/cTDsL/1

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') 但我认为它没有用。

华泰