Question

我有一个简单的HTML表单，它在部分验证中使用了ajax。 ajax正常工作并正确显示错误，但如果所有验证都通过，则表单不会提交。基本上没有任何反应。在Firebug中没有任何事情发生，页面本身没有任何反应，等等。这是调用表单验证的Javascript：

var pass_form = $('#pass_form');
pass_form.submit( valid_pass_sett );

function valid_pass_sett() {
    $('.caption_error').remove();
    $('input').removeClass('error');
    pass_old = $('input[name=pass_old]').val();
    pass_new = $('input[name=pass_new]').val();
    pass_confirm_new = $('input[name=pass_confirm_new]').val();

    if (pass_old === "") {
        //display error on form - snipped
        return false;
    } else if (pass_new === "") {
        //display error on form - snipped
        return false;
    } else if (pass_new != pass_confirm_new) {
        //display error on form - snipped
        return false;
    } else if (pass_new.length < 8) {
        //display error on form - snipped
        return false;
    } else {

        $.post("http://www.example.com/ajax/validate.php",{ // async validation
            type: 'valid_old_change_pass', 
            pass_old: pass_old,
            pass_new: pass_new
        }, valid_pass_combo_callback);

    }
    return false;  // cancel form submission
}

function valid_pass_combo_callback( data ) {
    if (data == 'valid') {
        //only if the form is valid!
        pass_form[0].unbind('submit').submit();
        //pass_form[0].submit();
    } else if (data == "invalid_old") {
        //display error on form - snipped
    }
    else if (data == "invalid_new") {
        //display error on form - snipped
    }
    else {
        //display error on form - snipped
    }
}

以下是表单的基本HTML代码：

<form id="pass_form" class="standard" method="post" action="http://www.example.com/preferences" onsubmit="return valid_pass_sett()">
    <fieldset>
        <div>
            <label for="pass_old">Old password:</label>

            <input type="password" id="pass_old" name="pass_old" />
        </div>
                <div>
            <label for="pass_new">New password:</label>
            <input type="password" id="pass_new" name="pass_new" />
        </div>
        <div>
            <label for="pass_confirm_new">Confirm new password:</label>
            <input type="password" id="pass_confirm_new" name="pass_confirm_new" />
        </div>
                <div>
            <label></label>
            <input type="submit" id="pass_submit" name="pass_submit" value="Change password"/>

            <input type="reset" id="pass_reset" name="pass_reset" value="Cancel"/>
        </div>
    </fieldset>
</form>

该脚本一直到pass_form[0].unbind('submit').submit();行，但表单不提交。这里有什么帮助吗？

Answer 1

更改回调方法valid_pass_combo_callback

中的以下行

//Replace this line

   pass_form[0].unbind('submit').submit();

//By this

   pass_form.unbind('submit').submit();

Answer 2

我决定放弃将此函数绑定到提交，而是绑定到表单上的按钮的onclick事件（我用它代替提交按钮）并解决了问题。单击按钮时将调用验证，如果客户端验证通过，则表单将提交给服务器以进行验证。

成功进行AJAX验证后，HTML表单不会提交

2 个答案: