3

我正在为 ajax 调用使用 ajax 加载程序（如请稍候 .gif 图像）图像。在几天之前，它可以完美运行并以 chrome 显示。

我没有看到图像有任何问题，或者我们没有更改它。它在 IE、Mozilla 和其他浏览器中正确显示，但我不明白为什么它没有在 chrome 中显示。

我看过Ajax Loader Not Showing in Google Chrome但没有得到任何帮助。

html标记是

<div id="divajaxProgress" class="progressouter" style="display: none;">
     <div class="ProgressInner">
        <img alt="" title="Please wait..." src="../Images/ajax-loader.gif" />
     </div>
</div>

divajaxProgress将在出现 ajax 调用时显示，一个简单的示例是页面加载。这里是函数

function HideProgress() {                
  $("#divajaxProgress").hide();
}

function ShowProgress() {        
  if ($('#divajaxProgress').is(':visible') == false) {
    $("#divajaxProgress").show();
  }
}

你可以在这里看到图片

请建议我这里有什么问题。

4

7 回答 7

6

您最近是否更改为使用同步 Ajax 调用？

异步：假

如果是这样，我已经看到动画不更新的问题。大多数浏览器在同步 ajax 调用期间不会取回控制权并且不会更新图像。然而不知何故 Firefox 正在更新图像。

于 2013-05-30T06:31:42.873 回答
2

试试这个。在铬上测试！！！

function HideProgress(){
     $('#divajaxProgress').css('display','none');
}

 function ShowProgress() {        

    if($('#divajaxProgress').css('display') == "none"){
        $("#divajaxProgress").show();
    }
 }


    $.ajax({
        url: 'url here',

        type: "post",

        beforeSend: function () {
             ShowProgress();
        },

        error: function(){
           HideProgress();
        },

        success: function (result) {
            alert(result);
            HideProgress();
        }
    })

这可能不是您的 ajax 的结构，但请确保您ShowProgress()在beforeSend中调用并HideProgress()在成功回调或错误回调之后调用。

于 2013-05-30T06:13:51.660 回答
0

尝试：更改或添加到async: true,ajax 部分，如下所示。它可能会工作..

$.ajax({
        url: 'url here',

        type: "post",
        async: true,  //for synchronize browser & server side.

        beforeSend: function () {
             ShowProgress();
        },

        error: function(){
           HideProgress();
        },

        success: function (result) {
            alert(result);
            HideProgress();
        }
    })
于 2015-03-23T06:52:36.387 回答
0

您可以尝试以下操作。使用 Jquery，您可以更改块的显示样式。这也应该在跨浏览器中工作。

function HideProgress() {                
  $("#divajaxProgress").css({ display: "none" });
}

function ShowProgress() {                
  $("#divajaxProgress").css({ display: "inline" });
}

让我知道这是否有帮助。

于 2013-05-30T06:00:18.037 回答
0

您的图像已损坏。它根本没有出现在 Chrome 中。

如果您在文本编辑器中打开图像，您将看到附加的 html 表单：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1"><title>
    Untitled Page
</title></head>
<body>
    <form name="form1" method="post" action="ViewFile.aspx?FileId=2473" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJNzgzNDMwNTMzZGQ=" />
</div>

    <div>
    </div>
    </form>
</body>
</html>

好像是误加了。

于 2013-05-30T08:17:56.723 回答
0

而是在成功或错误中隐藏加载程序。在ajax调用的完整状态下隐藏它

$.ajax({
        url: 'url here',
        type: "post",
        async: false,
        beforeSend: function () {
             ShowProgress();
        },
       complete: function () {
           HideProgress();
       },
       success: function (result) {
            alert(result);       
       },
       error: function(err){
          //Show error 
          alert(err);
       }
    });

于 2017-05-08T07:49:45.947 回答
0

有同样的问题。并得到了这个解决方案

请注意，同步请求可能会暂时锁定浏览器，从而在请求处于活动状态时禁用任何操作。

如果您在 ajax 调用中使用属性“async：false”，请尝试此解决方案。

        $("div.spanner").show();
        setTimeout(function () {
            $.ajax({
                    url: '@Url.Action("SaveAnswer")',
                    type: "POST",
                    data: data,
                    async: false,
                    success: function (result) {
                        console.log(result);
                        if (result.Status) {                            
                            bool = true;

                        } else {
                            alert(result.Message);
                        }
                    },
                error: function (result) {
                    $("div.spanner").hide();
                    }
            });
        }, 10);
于 2020-08-28T06:39:55.313 回答