Question

我有一个包含表单的页面

一旦用户提交表单，我希望按钮消失，并使用旋转器gif和现在验证消息显示

所以我有：

function submit_application(input){



    $('#create_account_button').hide();
    $('#create_account_validating').show();


    var form = $(input).parents('form:first');
    var form_id = ($(form).attr('id'));
    var valid = validate_form(form_id);

    if(valid){
        $('#'+form_id).submit();
    }


}

在我的表单提交按钮上我有：

onclick="submit_application(this);return false"

validate_form循环遍历每个输入并验证语法等。

需要几秒钟才能完成，因为服务器的调用是为了验证某些字段，因此需要使用spinner gif“验证现在”div

这一切在Firefox中运行良好，但在Internet Explorer和Chrome中按钮似乎永远不会消失

我在拍摄时遇到了一些麻烦，并意识到发生的事情是那些浏览器在隐藏并显示相关div之前验证表单..

奇怪的行为，任何想法？

Answer 1

尝试在延迟函数中包装validate，就像这样......

function submit_application(input){
    $('#create_account_button').hide();
    $('#create_account_validating').show();

    setTimeout(function() {
        var form = $(input).parents('form:first');
        var form_id = ($(form).attr('id'));
        var valid = validate_form(form_id);

        if(valid){
            $('#'+form_id).submit();
        }
    }, 250);
}

我不知道为什么你的代码正在按你所描述的那样做，但这应该可以解决问题。

Answer 2

尝试使用jQuery的提交处理程序：http://api.jquery.com/submit/

$('#myform').submit(function() {
    $('#create_account_button').hide();
    $('#create_account_validating').show();

    var valid = validate_form('myform');
    if(valid)
        $(this).submit();
    else
        return false;
}

Answer 3

使用回调？

function submit_application(input){    

    $('#create_account_button').hide(0, '', function(){

        $('#create_account_validating').show(0, '', function(){
            var form = $(input).parents('form:first');
            var form_id = ($(form).attr('id'));
            var valid = validate_form(form_id);

            if(valid){
                $('#'+form_id).submit();
            }
        });
    });
}

JQuery .hide（）函数不会立即在chrome和Internet Explorer中触发。在Firefox中工作正常

3 个答案: