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/

<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/yijiang/cTDsL/1

Answer 3

这是我的解决方案。我会工作到任何具有class =“set-default”的字段

结帐working example

以下是代码：

$(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

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

3 个答案: