在 ajax 调用中加载图像在 chrome 中不起作用

Question

我有一个 html 页面，我想在其中显示在 ajax call 之间使用 loading image 进行保存和成功的处理。我将那个页面作为 webresourse 放在 dynamics crm 中。

Problem is that Loading works fine in mozilafirefox but not working in chrome.

脚本：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

其他代码：

<img src="sm_loading.gif" id="loading" style="display:none" />
<input class="custom-btn" id="btnsave" value="Save" onclick="SaveData();"  type="button">
function SaveData() {
    $('#loading').show();
    var stocktrack = {};
    stocktrack.sm_Description = descval;
    var jsonPO = window.JSON.stringify(stocktrack);
    var oDataUri = serverUrl + "/XRMServices/2011/OrganizationData.svc/sm_stocktrackingSet";
    $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        datatype: "json",
        url: oDataUri,
        data: jsonPO,
        async: false,
        beforeSend: function (XMLHttpRequest) {
            XMLHttpRequest.setRequestHeader("Accept", "application/json");
        },
        success: function (data, textStatus, XmlHttpRequest) {
            debugger;
            $('#loading').hide();
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert(textStatus);
        }
    });
}

有解决办法请指教

Answer 1

我运行您在 Firefox 中的代码并且有效。正如你所说，我也在 Chrome 中运行并且一无所获。但是，通过在 Chrome 中打开调试器，使用 F12，我得到了以下错误。

主线程上的同步 XMLHttpRequest 已弃用，因为它会对最终用户的体验产生不利影响。如需更多帮助，请查看 https://xhr.spec.whatwg.org/.

要解决此问题，请将 ajax 调用中的异步标志设置为 true。

如果你想让你的用户在你的异步调用期间不按下东西，这是完全可以理解的，我建议你使用 t运行sparent 阻塞层。

Answer 2

我得到答案了。

使用setTimeout(function(){..our code..},10);我可以使用 async:false.

在 chrome 中显示加载

引用Link:

https://www.experts-exchange.com/questions/25187194/jQuery-async-false-with-beforeSend.html

Answer 3

加载面板仅适用于 async:True，否则它只能在 firefox 上工作，大多数其他浏览器不显示加载面板。但是对于异步 false，除了成功和错误（回调函数）之外的所有代码都将被执行。

在 ajax 调用中加载图像在 chrome 中不起作用

Loading image in ajax call is not working in chrome

javascript

ajax

jquery

asp.net-ajax

dynamics-crm-2013