jquery清除input的默认值

我怎样才能清除焦点与jQuery的input表单的默认值,并按下提交button时再次清除?

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

你可以用这个..

 <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'; 
 $(document).ready(function() { //... //clear on focus $('.input').focus(function() { $('.input').val(""); }); //clear when submitted $('.button').click(function() { $('.input').val(""); }); 

});

除非你真的担心旧的浏览器,你可以使用新的HTML5占位符属性,如下所示:

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

尝试一下:

  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); }); 
 $('.input').on('focus', function(){ $(this).val(''); }); $('[type="submit"]').on('click', function(){ $('.input').val(''); }); 

只是一个速记

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