title: how to make a area not clickable
body: <p>I got a <code>&lt;a&gt;</code> that contains a <code>&lt;input type="text"&gt;</code>
  clicking the <code>&lt;a&gt;</code>will submit the parent form, the input in the <code>&lt;a&gt;</code> is for the quantity and as it is now trying to change amount it will trigger the form. i got idea of what how i could do this but i dont know how to finish the jquery, so i would appriciate some help</p>
  
  <p>this is what i got so far</p>
  
  <pre><code>$(document).ready(function() {
          $('.submit-parent-form').click(function() {              
              alert($(this).children('#quantity').val());
          });
  
          $('.input-a-tag').focus(function(){
              $(this).parent('.submit-parent-form') //here i need to prevent the click
          });
      });
  </code></pre>
  
  <p>html</p>
  
  <pre><code>&lt;a class="submit-parent-form"&gt;&lt;input id="quantity" type="text" class="input-a-tag" value="1" /&gt;&lt;/a&gt;
  </code></pre>
  
  <p><strong>EDIT</strong>
  I see not that my solution wont work how i thought based on that the <code>&lt;a&gt;</code> gets the click before the focus, any ideas on how i could do<br /><br />
  <strong>EDIT 2</strong>
  the problem is when i try to get to the input in the a tag, trying to change the quantity</p>