Jquery .show只在最后显示

本文关键字：最后 显示 show Jquery | 更新日期: 2023-09-27 18:18:28

我想在执行webmethod的ajax命令之前显示一个加载div，并在命令结束时关闭。div只出现在ajax命令实现的末尾。

下面的代码块

$("#dvUpProgress1").show();
$.ajax({
            type: "Post",
            url: "producao.aspx/GravarListaSalvar",
            data: "",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            async: false,
            success: function (obj) { }
        });

后面的代码:

[WebMethod]
    public static string GravarListaSalvar(string IdAutorizacaoProducaoGarantiaQualidade, string IdEtapa, string IdSubEtapa, string IdUsuarioLogado, string NomeCampo, string NomeAmigavel, string Resposta, string IdCampo)
    {
        ...
    }

Jquery .show只在最后显示

您已经通过async: false将POST请求设置为同步。浏览器不会渲染东西，直到脚本完成运行-这只发生在你的帖子完成后。

如果希望显示进度条，则需要异步实现调用，这样浏览器就可以在服务器处理请求时呈现正在加载的div。在当前例程调用之后完成的任何操作，都将转移到您创建的success函数。你的javascript应该像这样更新:

$("#dvUpProgress1").show();
$.ajax({
    type: "Post",
    url: "producao.aspx/GravarListaSalvar",
    data: "",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    async: true,
    success: function (obj) {
        // Here is where the rest of your code should go 
    }
});

您将注意到我将async更改为true，这告诉浏览器异步处理调用，从而释放浏览器以呈现进度条。

如果你绝对必须同步调用，你总是可以通过这样做来实现setTimeout 

$("#dvUpProgress1").show();
setTimeout(function () {
    $.ajax({
        type: "Post",
        url: "producao.aspx/GravarListaSalvar",
        data: "",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        async: false,
        success: function (obj) {
            // Here is where the rest of your code should go 
        }
    });
}, 100);

. .但这样一来，您就真的失去了AJAX开发时所要做的异步处理的所有好处(毕竟，AJAX代表异步JS和XML)。所以我真的，真的会建议反对做同步调用。

相关文章：