jquery - Ajax 表单忽略验证

Question

之前没怎么用过ajax，所以选择了jQuery Form plugin。我的目标是让插件提交表单，使用我的验证来检查表单字段是否正确填写，如果是则提交表单。

上述所有工作，除了验证。当我单击“提交”时，验证会短暂显示，然后该框会淡出，正如我在 ajax 表单脚本中的成功调用中设置的那样。

var options = { 
    beforeSubmit: validation,
    success: function() {
        var url = '/includes/embed-topbar-login-account';
        $('#account').load(url, function() {
            $('#account-options').fadeOut('slow');
        });
    }
}; 

$('#login').ajaxForm(options); 

function validation() {
    var prompt = '<div class="required-prompt"><small>This field is required.</small></div>';
    var promptEmail = '<div class="required-prompt"><small>Invalid email address.</small></div>';
    var required = true;

        $('.required-prompt', this).remove();
        $('.required', this).each(function() {
            if( !$(this).val() ) {
                $(this).after(prompt);
                required = false;
            } else {
                $('.required-prompt', this).remove();
            }
        });

    return required;
}

谁能告诉我是否需要任何额外的步骤来确保如果验证返回“false”（目前确实如此），提交被停止。

Answer 1

you shsould specify beforeSubmit

SOURCE Documentation

$('#login').ajaxForm({ 
    success: function() {
        var url = '/includes/embed-topbar-login-account';
        $('#account').load(url, function() {
            $('#account-options').fadeOut('slow');
        });
    }, 
    beforeSubmit: function(arr, $form, options) { 
    // The array of form data takes the following form: 
    // [ { name: 'username', value: 'jresig' }, { name: 'password', value: 'secret' } ] 

    // return false to cancel submit                  
     return validate(); //Assuming validate is your function doing validation.

    }
});