Question

I want to interrupt and prevent a form from submitting using jQuery. Here’s my form markup:

<div id="register-box">
        <div id="register-box-inner">
            <h2>Register</h2>
            <form action="/register" method="post" id="register-form">
                <p><label for="username">Username:</label><input type="text" name="username"></p>
                <p><label for="password">Password:</label><input type="password" name="password"></p>
                <p><label for="email">E-mail:</label><input type="text" name="email"></p>
                <p><input type="submit" value="Register" class="register"></p>
            </form>
        </div>
    </div>

and my Javascript code thus far:

$('#register-form').submit(function(e){
    e.preventDefault();
    alert("hi");
});

Problem is, the form still goes through. I wanted to submit the form using AJAX but with a fallback for users who don’t have Javascript enabled. No errors pop up in the Javascript console, either.

Answer 1

Try

$("form").live("submit", function() {
        alert("hi");
        return false;
    });