title: Hide/clear input field with prototype
body: <p>I have the following script:</p>
  
  <pre><code>if (Object.isUndefined(Axent)) { var Axent = { } }
   Axent.SelfLabeledInput = Class.create({
  initialize: function() {
      var labelSelector = arguments[0] || 'label';
      $$(labelSelector).findAll(function(l) {return (l.readAttribute('for') !== null)}).each(function(l){
          l.hide();
          $(l.readAttribute('for'))._value = l.innerHTML;
          if ($(l.readAttribute('for')).value.empty()) {
              $(l.readAttribute('for')).value = $(l.readAttribute('for'))._value
          }
          $(l.readAttribute('for')).observe('blur',function(e){if(Event.element(e).value == '') Event.element(e).value = Event.element(e)._value;});
          $(l.readAttribute('for')).observe('focus',function(e){if(Event.element(e).value == Event.element(e)._value) Event.element(e).value = '';});
      });
  }
  });
  </code></pre>
  
  <p>And the following form :</p>
  
  <pre><code>    &lt;form name="comform" action="#" method="post" id="commentform"&gt;
      &lt;div class="input"&gt; 
  &lt;p&gt;
  &lt;label for="comment"&gt;Type your comment here...&lt;/label&gt;
  &lt;textarea name="comment" id="comment" rows="8" cols="10" class="" &gt;&lt;/textarea&gt;
  &lt;/p&gt;
  &lt;/div&gt;
      &lt;div class="input"&gt;
  &lt;p&gt;
  &lt;label for="author"&gt;Name (required)&lt;/label&gt;        
  &lt;input type="text" name="author" id="author" size="22" class=""/&gt;
  &lt;/p&gt;
  &lt;/div&gt;
      &lt;div class="input"&gt;
  &lt;p&gt;
  &lt;label for="email"&gt;Email (gravatar enabled) (required)&lt;/label&gt;         
  &lt;input type="text" name="email" id="email" size="22" class=""/&gt;
  &lt;/p&gt;
  &lt;/div&gt;
      &lt;div class="input"&gt;
  &lt;p&gt;
  &lt;label for="url"&gt;Website (optional)&lt;/label&gt;        
  &lt;input type="text" name="url" id="url" size="22" /&gt;
  &lt;/p&gt;
  &lt;/div&gt;
      &lt;div class="submit"&gt;
  &lt;input type="submit" name="submit" id="sub" value="Leave comment" /&gt; 
  &lt;input type="hidden" name="comment_post_ID" id="hidden" value=""&gt; 
  &lt;/div&gt;
  
  &lt;/form&gt; 
  &lt;script type="text/javascript"&gt;
  //&lt;![CDATA[
  new Axent.SelfLabeledInput('#commentform label');
  //]]&gt;
  &lt;/script&gt;
  </code></pre>
  
  <p>I want to write a function from this script such that when I press the submit on this form, and an input field is focused, it hides/clears it, so it doesn't get submitted to the database.</p>
  
  <p>This works with the latest Prototype lib. I don't know any JavaScript, so I need your help. I'm using this form for my WordPress comments area.</p>