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

这应该有效。我相信你有脚本的其他部分知道如何绘制该表。只需在成功回调中添加该代码

$(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交互之前等待。因此，在ready函数之外执行请求，并在成功回调中监听dom。

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

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

Answer 3

如果您希望阻止jQuery ajax调用阻止，则必须将async设置为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
            } 
        });

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

3 个答案: