0

我有一个将表单提交给 mvc 控制器的函数，如下所示 -

function submitForm() {
            $.ajax
            ({
                type: 'POST',
                url: '/Users/Index',
                data: $('#searchForm').serialize(),
                beforeSend: function() { 
                    $('.usersearchresult').fadeOut('fast', function () { $('.loadinggif').show(); }); 
                    },
                success: function (response) {
                    $('.loadinggif').hide();
                    $('.usersearchresult').hide().html(response).fadeIn('normal');

                }
            });

            return false;
        }

这工作正常，除非响应返回太快$('.loadinggif').hide();发生在之后 $('.usersearchresult').hide().html(response).fadeIn('normal');

我尝试了回调函数的不同组合（$('.loadinggif').hide();调用回调$('.usersearchresult').hide().html(response).fadeIn('normal');，甚至相反，行为总是相同的。

我是 jquery 的新手；任何帮助将不胜感激！

4

1 回答 1

1

问题是fadeOut如果响应返回太快，动画还没有完成。

要解决此问题，请使用stop将结束动画的方法：

success: function (response) {
    $('.usersearchresult').stop();
    $('.loadinggif').hide();
    $('.usersearchresult').hide().html(response).fadeIn('normal');

}

请注意，这stop将阻止回调被调用，因此当动画仍在运行时，.loadinggif将永远不会显示响应是否返回。fadeOut最简单的方法是同时调用$('.usersearchresult').stop();和$('.loadinggif').hide();。它们是互斥状态，因此您可以测试 loadinggif 是否正在显示并确定您是否应该调用stop或hide。

于 2013-06-19T14:17:50.613 回答