javascript - 收到AJAX结果后，加载程序不会消失

我有一个页面通过AJAX显示数据，直到获取结果之前，我希望显示一个加载程序，并且一旦获取结果，我希望加载程序应该消失。以下是我试图显示加载程序的部分代码

var onSubmit = function(e)
    {
        var txtbox = $('#txt').val();
        var hiddenTxt = $('#hidden').val();

        $("#walkaway").hide();
        $("#submitamt").hide();
        $("#xtrabutton").hide();

        LodingAnimate();
        $.ajax(
            {
                type: 'post',
                url: 'test2.php',
                dataType: 'json',
                data: {txt: txtbox,hidden: hiddenTxt},
                cache: false,
                success: function(returndata)
                    {
                        $('#first').html(returndata[0]);
                        $('#second').html(returndata[0]);
                        $('#third').html(returndata[0]);
                    },
                error: function()
                    {
                        console.error('Failed to process ajax !');
                    }
            });

            function LodingAnimate()
            {
                $("#maillist").html('<img src="img/ajax-loader.gif" /> Please Wait Loading...');
            }
    };

单击按钮后，将执行上述AJ​​AX，单击后加载程序将运行，但即使在我收到答复（在控制台中）后，加载程序仍会继续运行，但实际上它应该已经消失了。

最佳答案

您应该在ajax调用完成之后手动隐藏/删除加载程序，添加Jquery Complete回调并添加代码以在其中删除加载程序。

jQuery Complete-成功执行此回调并将执行错误回调。

     $.ajax(
            {
                type: 'post',
                url: 'test2.php',
                dataType: 'json',
                data: {txt: txtbox,hidden: hiddenTxt},
                cache: false,
                success: function(returndata)
                    {
                      //Success code
                    },
                error: function()
                    {
                        //error code
                    },
                complete:function()
                    {
                     //This block will execute after success/error executes.
                     //Make the loader div empty
                     $("#maillist").empty();
                    }
            });