Posted By

tjboverl on 09/30/11


Tagged

jquery CSS3 placeholder


Versions (?)

placeholders using jQuery


 / Published in: jQuery
 

  1. <script type="text/javascript">
  2. $(document).ready(function(){
  3. $('.inputfield').each(function(){
  4. $(this).val('');
  5. add_placeholder($(this));
  6. })
  7.  
  8. $('.inputfield').focus(function(){
  9. remove_placeholder($(this));
  10. }).blur(function(){
  11. add_placeholder($(this));
  12. }).blur();
  13. });
  14.  
  15. function add_placeholder(field)
  16. {
  17. var placeholder = field.attr('name');
  18. if(field.val() == '')
  19. {
  20. field.val(placeholder);
  21. field.addClass('placeholder');
  22. }
  23. }
  24.  
  25. function remove_placeholder(field)
  26. {
  27. var placeholder = field.attr('name');
  28. if(field.val() == placeholder)
  29. {
  30. field.val('');
  31. field.removeClass('placeholder');
  32. }
  33. }
  34.  
  35. </script>

Report this snippet  

You need to login to post a comment.