how to make a area not clickable

I got a <a> that contains a <input type="text"> clicking the <a>will submit the parent form, the input in the <a>开发者_StackOverflow; 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

this is what i got so far

$(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
        });
    });

html

<a class="submit-parent-form"><input id="quantity" type="text" class="input-a-tag" value="1" /></a>

EDIT I see not that my solution wont work how i thought based on that the <a> gets the click before the focus, any ideas on how i could do

EDIT 2 the problem is when i try to get to the input in the a tag, trying to change the quantity

try this:

$('.input-a-tag').click(function(event){
        event.stopPropagation();
    });

this should make click on the input element, not propagating to it's parent.

var prevent = false;
$(".submit-parent-form").click(function(e){         

    if(prevent)
        e.preventDefault();
    else
        alert($(this).children('#quantity').val());
});

$(".submit-parent-form").focus(function(){
    prevent = true;
});


$(".submit-parent-form").blur(function(){
    prevent = false;
});

See how it works at http://jsfiddle.net/zND4B/4/

EDIT: I added alert that shows before activating href in a on http://jsfiddle.net/zND4B/6/ Note that a can be without href.

Simple way is:

$("#ElementName").css("pointer-events","none");