Javascript HTML自动刷新，尽管jQuery拦截

我正在通过Parse.com JavaScript开发一个网站。我正在登录页面上工作，发现了这个不错的模板：

但是，当我试图修改要通过Parse.com处理的页面的提交部分时，页面会在Parse.com事务发生之前自动刷新。我知道JavaScript文件被正确引用了

HTML:

我从来没有收到气球说表格已经提交。帮忙

编辑：多亏了穆格斯

<div class="login-card">
     <h1>Prindle Login</h1>
    <br>
    <form id="form">
        <input id="prindle_log_on_username" type="text" name="user" placeholder="Username">
        <input id="prindle_log_on_password" type="password" name="pass" placeholder="Password">
        <input id="prindle_log_on" type="submit" class="login login-submit" value="Log In">
    </form>
    <div class="login-help"> <a href="#">Register</a> • <a href="#">Forgot Password</a>

    </div>
</div>

$(document).ready(function () {
    $('#prindle_log_on').on("click", function (e) {
        e.preventDefault();
        alert("form has been submitted.");

    });
});

---

将单击处理程序放在$document.ready中，因为在主体呈现之前，将找不到$'prindle\u log\u on'

---

似乎没有改变任何东西：我将添加您推荐的更新

// dynamically adding to a document: http://www.sanwebe.com/2013/03/addremove-input-fields-dynamically-with-jquery/comment-page-1

$(document).ready(function() {
    alert('hello');
    Parse.$ = jQuery;
    Parse.initialize("APP ID", "JS ID")
});

// called when the user clicks the log in button
$('#prindle_log_on').on("click",function(e) {
    e.preventDefault();
    alert("form has been submitted.");
    // perform onclick

    // get the values of the input fields for username and password
    var username = $('#prindle_log_on_username').val();
    var password = $('#prindle_log_on_password').val();

    // try to log in
    Parse.User.logIn(username, password,
        {
            success: function(user) {
                // Do stuff after successful login.
                alert('user found');
            },
            error: function(user, error)
            {
                // The login failed. Check error to see why.
                alert('log in failed');
            }
        });
});

<div class="login-card">
     <h1>Prindle Login</h1>
    <br>
    <form id="form">
        <input id="prindle_log_on_username" type="text" name="user" placeholder="Username">
        <input id="prindle_log_on_password" type="password" name="pass" placeholder="Password">
        <input id="prindle_log_on" type="submit" class="login login-submit" value="Log In">
    </form>
    <div class="login-help"> <a href="#">Register</a> • <a href="#">Forgot Password</a>

    </div>
</div>

$(document).ready(function () {
    $('#prindle_log_on').on("click", function (e) {
        e.preventDefault();
        alert("form has been submitted.");

    });
});