Question

我有一个像

这样的功能

private void convertData()
{
    //Business logic...

    List<FeedRow> feed = JsonConvert.DeserializeObject <List<FeedRow>> (content);
}

public class FeedRow
{
    public string eventPK { get; set;}
    public string picturePK { get; set;}
}

这里的问题是，在进行ajax调用之前，加载器没有显示出来。如果我输入一个记录的控制台日志语句。

我做了一些搜索并且知道同步AJAX调用会冻结浏览器。但它可以显示加载器，然后冻结浏览器不是吗？

Answer 1

我做了一些搜索，并了解了同步AJAX调用冻结浏览器。但它可以显示加载器然后冻结浏览器不是吗？

我不同意这样做，但你可以听完show show然后进行同步通话：

$('.loader').show(500, m1);

function m1(){
   var xargs={
          type : 'POST',
          url : resourceUrls["listUrl"],
          data : "sId="+sId,
          async:false,
          dataType : "text",
          success : OnGetJsonCallback,
          failure : function(response) {
                 $(".loader").hide();
                 }

   };

  $.ajax(xargs);
}

Answer 2

主线程上的同步XMLHttpRequest因其对最终用户体验的不利影响而被弃用。如需更多帮助，请查看Specs。

因此，您可以通过在网页中实施 UI拦截器，而不是使用同步请求来使用异步请求获得相同的结果。只需将宽度和高度的div放在较高的z-index。并且它不会冻结你的加载元素。

Answer 3

Javascript是单线程的，这意味着如果在callstack上有任何内容，浏览器就无法调用绘制（并渲染加载器的移动），因为渲染队列正在等待堆栈清除，因此加载器不会仅在请求完成并且弹出调用堆栈后才移动。

javascript的本质是异步的，因为你不应该阻塞堆栈以便能够响应用户交互，这就是使用回调和异步方法的原因。

我建议您找出一种使用async而不是同步请求的方法。（你不能要求你在javascript中做这样的事情。）
如果确实如此，您可以在其上显示带有静态加载文字的白色屏幕。但是，由于下一个渲染标记被阻止，因此屏幕不会设置动画或允许用户交互。（仅在同步请求完成之前）。

这样做你必须写下以下内容：

function m1(){
    $('.loader').show();

   var xargs={
          type : 'POST',
          url : resourceUrls["listUrl"],
          data : "sId="+sId,
          async:false,
          dataType : "text",
          success : OnGetJsonCallback,
          failure : function(response) {
                 $(".loader").hide();
                 }

   };
   setTimeout(function() {
      $.ajax(xargs);
   },0);
}

在超时中包装同步ajax请求的原因是允许浏览器在将请求放入堆栈并阻止所有内容之前进行绘制。

先前的声明没有在同步ajax调用上执行

3 个答案: