RockPaperScissors

LizardSpock

jQuery Clear Form on Focus and Restore on Exit

| Comments

I used this as a jQuery reference to hide and show default text in forms.

<head>
   <script type=”text/javascript” src=”js/jquery.js”></script>
   <script type=”text/javascript”>

   $(document).ready(function(){

      var clearMePrevious = ”;

      // clear input on focus
      $(’.clearMeFocus’).focus(function()
      {
         if($(this).val()==$(this).attr(’title’))
         {
            clearMePrevious = $(this).val();
            $(this).val(”);
         }
       });

       // if field is empty afterward, add text again
       $(’.clearMeFocus’).blur(function()
       {
        if($(this).val()==”)
        {
          $(this).val(clearMePrevious);
        }
    });
});

</script>
</head>

and the for the form

<input type=”text” name=”email” title=”Enter your email” value=”Enter your email” class=”clearMeFocus” />

Comments