Question

在我的应用程序中，我在$(document).ready()函数中进行了多次ajax调用。问题是浏览器保持“加载”状态，直到ajax调用返回。而且由于这些ajax调用大约需要15-20秒才能完成，这会让我的页面加载时间变得令人厌恶我的期望是，由于ajax调用是异步的，一旦所有页面加载请求完成，浏览器应该退出“加载状态”，而不是在ajax调用完成时关心。

是否还有其他事件我应该拨打ajax电话？我还尝试将ajax次调用放入window.onload事件回调中，但我仍然遇到同样的问题。

编辑：代码非常简单。我有一个HTML文件，在我加载脚本的头部有一些脚本标记：

<head>
    <script src="script1.js"></script>
    <script src="script2.js"></script>
</head>

在我的一个剧本中：

$(document).ready( 
     // 3 ajax calls
 );

我使用Ajax调用获取JSON。现在，我在开发工具包中看到，只有当所有这三个ajax调用都返回时，浏览器才会出现“加载”状态。我还注意到，当我的页面加载网络请求被缓存时，浏览器不会等待这些ajax调用。但是对于空缓存，完成所有页面加载请求大约需要3-4秒，在这种情况下，ajax调用也会导致浏览器保持“加载状态”。

请帮忙。谢谢！

Answer 1

我猜你正在尝试使用AJAX加载DOM吗？因为如果有DOM元素或其他网页都在一起，那么加载页面就会出现问题，因为有多个页面需要构建您的页面。因为每个$(document).ready()似乎你正在使用JQuery并且没有问题，并且正如你所提到的那样，你同时也有回调，那么调试必须是好的。如果你试图做到这一点，你可能会面临一个问题，否则ajax不应该是一个痛苦。

Answer 2

据我所知，.ready（）是一个在DOM完全加载时执行的函数。这意味着你的ajax调用可能不会导致“加载”状态。检查您的DOM是否包含iframe或在此处发布您的代码。

Answer 3

好！为什么不在成功函数中调用ajax调用。

$.ajax({
.........
    success:function(){
        your load stuff here

       $.ajax({
           .........
           success:function(){
               your load stuff here
           }
      });
    }      // end of success of first ajax call
});

或者您可以在complete function：

中使用它

$.ajax({
    .........
    success:function(){
        your load stuff here
    },
    complete:function(){
       $.ajax({
          .........
          success:function(){
               your load stuff here
          },
          complete:function(){

          }
       });
    }
});

Answer 4

Ajax调用不是真正的异步，Ajax有助于在没有页面回发的情况下进行服务器调用。

假设您从JavaScript调用服务器端方法，在调用服务器端方法之后，您的javaScript将不会移动到下一行，直到它从服务器接收响应。

如果您使用jQuery for Ajax调用，请将asynch属性设置为true，然后它将等待服务器响应。

页面加载时的Ajax调用会增加上载时间

4 个答案: