jquery清除输入默认值

如何清除jQuery中焦点输入表单的默认值，并在按下submit按钮时再次清除它？jquery清除输入默认值

<html> 
     <form method="" action=""> 
      <input type="text" name="email" value="Email address" class="input" /> 
      <input type="submit" value="Sign Up" class="button" /> 
     </form> 
</html> 

<script> 
$(document).ready(function() { 
    //hide input text 
    $(".input").click(function(){ 
     if ($('.input').attr('value') == ''){ 
      $('.input').attr('value') = 'Email address'; alert('1');} 
     if ($('.input').attr('value') == 'Email address'){ 
      $('.input').attr('value') = ''} 
    }); 
}); 
</script>

来源

2012-08-01 viktor

您可以使用原生的'placeholder'属性吗？有多种[polyfills]（https://github.com/jamesallardice/Placeholders.js）可用于使其在旧版浏览器中工作。 – 2012-08-01 08:09:30

@JamesAllardice为什么你没有发布它作为答案？我认为是最简单和最好的解决方案。 – jelies 2012-08-01 08:16:52

@jelies - 我没有把它作为答案发布，因为虽然它和OP正在做的事情一样，但它并没有真正回答他们的代码有什么问题。但我同意，这绝对是最简单的解决方案！ – 2012-08-01 08:21:44

你可以使用这个..你自己的代码

<body> 
    <form method="" action=""> 
     <input type="text" name="email" class="input" /> 
     <input type="submit" value="Sign Up" class="button" /> 
    </form> 
</body> 

<script> 
    $(document).ready(function() { 
     $(".input").val("Email Address"); 
     $(".input").on("focus", function() { 
      $(".input").val(""); 
     }); 
     $(".button").on("click", function(event) { 
      $(".input").val(""); 
     }); 
    }); 
</script>

说话，问题是，jQuery的的ATTR API可以由

$('.input').attr('value','Email Adress');

，而不是设置为你做：

$('.input').attr('value') = 'Email address';

来源

2012-08-01 09:57:25 Kaustubh

我决定使用这个答案，因为它看起来最优雅。 – viktor 2012-08-01 10:33:34

thnx.i我自己是新来jquery.this是我的第一个接受的anser在这里，和第三整体（因为你可能可以推断我的声望点） – Kaustubh 2012-08-01 10:53:15

为什么'$（'。input'）。removeAttr（'value'）'不起作用？ – 2015-11-04 17:19:01

试一下：

var defaultEmailNews = "Email address"; 
    $('input[name=email]').focus(function() { 
    if($(this).val() == defaultEmailNews) $(this).val(""); 
    }); 

    $('input[name=email]').focusout(function() { 
    if($(this).val() == "") $(this).val(defaultEmailNews); 
    });

来源

2012-08-01 08:10:24 tekilatexee

$('.input').on('focus', function(){ 
    $(this).val(''); 
}); 

$('[type="submit"]').on('click', function(){ 
    $('.input').val(''); 
});

来源

2012-08-01 08:11:02 Faust

除非你真的很担心旧的浏览器，你可以只使用新的HTML5占位符属性，像这样：

<input type="text" name="email" placeholder="Email address" class="input" />

来源

2012-08-01 08:12:07

“除非您真的担心旧浏览器”......您可以填充“placeholder”属性，以便它可以在较旧的浏览器中使用。查看我对该问题的评论，并查看[Modernizr wiki]（https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills）以获取其他示例。 – 2012-08-01 08:14:24

是的，这是真的，或者你可以只写一点JQuery来自己拉动属性，如果你热衷。 – 2012-08-01 09:30:37

$(document).ready(function() { 
    //... 
//clear on focus 
$('.input').focus(function() { 
    $('.input').val(""); 
}); 
    //clear when submitted 
$('.button').click(function() { 
    $('.input').val(""); 
});

} ）;

来源

2012-08-01 08:12:35

这是错误的$（'。input'）。attr（'value'）='Email address';'，应该是$（'。input'）。attr（'value'，'Email address'）; “这个答案如何提高？ – 2015-08-11 11:49:16

@ToniMichelCaubet编辑答案，谢谢。无论如何，该代码与问题无关。我从topicstarter的代码中复制它。 – 2015-08-12 08:00:25

只是简写

$(document).ready(function() { 
    $(".input").val("Email Address"); 
     $(".input").on("focus click", function(){ 
      $(this).val(""); 
     }); 
    }); 
</script>

来源

2015-08-21 19:11:46

jquery清除输入默认值

回答

相关问题