在文档准备好之前显示html页面

Question

我在准备填充表格的文档中有一些ajax调用。不幸的是，页面只在表格填充后才显示。

$(document).ready(function() { 
    // alert('Why'); 
    var jsondata2a; 
    turl = "/rims/tab1/get_data?abc=123"; 
    $.ajax({ 
    url: turl+"", 
    cache: false, 
    async: false, 
    success: function(data){ 
      jsondata2a = data; 
    }, 
    error: function(){ 
      $("#gerror").html("<p>An error has occurred!</p>"); 
     } 
    }); 

但是，如果我把警报语句就绪功能，立即用警告的页面显示，然后接受警告后填充表。

整个页面显示在警报声明中，但是如果警报不存在，那么在所有ajax调用完成之前，页面不会显示。我试图将ready函数移动到页面的不同部分而没有成功。我曾尝试使用IE和Chrome。

任何帮助表示赞赏。

谢谢

Answer 1

这应该工作。我相信你还有其他一些知道如何绘制该表的scipt。只添加成功回调

$(document).ready(function() { 
    // alert('Why'); 
    var jsondata2a; 
    turl = "/rims/tab1/get_data?abc=123"; 
    $.ajax({ 
    url: turl+"", 
    cache: false, 
    // async: false, 
    success: function(data){ 
      jsondata2a = data; 
      for(var i=0; i< data.length; i++){ 
       $("#table_id").append("<tr>" ...boud data here data[i].someAttribute... "</tr>"); 
      } 
    }, 
    error: function(){ 
      $("#gerror").html("<p>An error has occurred!</p>"); 
     } 
    }); 

Answer 2

你并不需要等待$(document).ready()执行一个Ajax请求的代码。你只需要等待与dom交互。因此，在就绪功能之外执行您的请求，并在您的成功回调中监听dom。

这不会阻止您的页面呈现。

$.ajax({ 
    ... 
    success: function() { 
    $(document).ready(function() { 
     /* manipulate DOM here */ 
    }); 
    } 
}); 

Answer 3

如果你想阻止你jQuery ajax呼叫阻塞，你必须有异步设置为true（默认值）。

 $.ajax({ 
      type: 'POST', 
      url: 'YourURLHere.html', 
      data: '{}', 
      contentType: 'application/json; charset=utf-8', 
      dataType: 'json', 
      async: true, 
      success: function (data, text) { 
       // Do Something 
      }, 
      error:function (request, status, error){ 
       // Alert Somebody 
      } 
     });