文書の準備が完了する前に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呼び出しが完了するまでページが表示されません。私は、準備機能をページの異なる部分に移動させようとしましたが、成功しませんでした。私はIEとChromeで試しました。

助けてください。

ありがとうございます。

Answer 1

これは動作するはずです。私はあなたがそのテーブルを描く方法を知っているsciptの他のprtを持っていると確信しています。ちょうど成功コールバックあなたはAJAXリクエストを実行するために$(document).ready()のを待つ必要はありません

$(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

でそのコードを追加します。あなたは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 
      } 
     });