Question

很抱歉，如果我会写不精确但我对ajax和jQuery相当新

我有这个

$(document).ready(function() {
})

包含两个ajax GET;

第一个从模板中获取HTML并将其加载到当前页面中。第二个从XML文件加载内容并将其加载到当前页面。

如何确保页面正确呈现，保证第一次成功后第二个GET被触发？实际上，有时页面会被填满，有时则不会。谢谢。

编辑：这是我正在使用的实际代码：

<script>
        var page;
        $(document).ready(function() {
            $.ajax({
                type : "GET",
                url : "template.html",
                dataType : "html",
                success : function(html) {
                    $('body').load('template.html #generalBox');
                    $.ajax({
                        type : "GET",
                        url : "content.xml",
                        dataType : "xml",
                        success : function(xml) {
                            page = $(xml).find('aTag');
                            $('#content').html(page.text());
//other loadings
                        }
                    });

                }
            });

        });

    </script>

EDIT2：

受到重温：问题在于

                    $('body').load('template.html #generalBox');

似乎与其余代码异步。我使用

加载了HTML

success : function(html) {
                    var ndoc = document.createElement('html');
                    ndoc.innerHTML = html;
                    page = $('body', ndoc);
                    $('body').html(page.html());
//2nd get

现在工作正常。

Answer 1

在DOM修改完成后，从第一个GET的回调调用第二个GET，这样第二个请求将在第一个GET的数据已经加载时执行。

使用.ajax()的非常一般的示例：

// 1st GET
$.ajax({
  // ...
  success: function(){
   // ...

   // 2nd GET
   $.ajax({
     // ...
   });
  }
});

修改

.load()正在异步加载内容，因此您需要在使用可选回调 .load()完成后调用第二个GET - 请参阅documentation。

尝试：

$.ajax({ // ... success : function(html) { $('body').load('template.html #generalBox', function() { // 2nd GET should be executed in the callback of .load() $.ajax({ // ... }); }); } });

Answer 2

$(document).ready(function() {
$.ajax({
   url : "Your server url",
   data : "data to posted",
   type : "GET",
    success :function(){
       //call your second ajax here...
}
});

})

ajax和jQuery：确保HTML页面正确呈现

2 个答案: