Question

我有一个显示一些内容的网页。查询本身很慢（4000毫秒）。

我不希望我的用户在加载页面的其余部分之前必须等待查询运行。

有没有办法可以在我的HTML模板中的标签之前和之后粘贴一些代码，这些代码会“延迟”执行该函数，直到其他所有函数都被渲染为止？

e.g：

<javascript code that tells the page not to render what comes next until very last>

<?php my_heavy_php_function(); ?>

</javascript>

Answer 1

正如我从你的问题中可以理解的那样，你应该选择AJAX：首先加载没有繁重内容的页面，当页面准备就绪时，你要对web服务进行AJAX调用以获取和显示数据，同时显示向用户发送“正在处理，请稍候”消息。

Answer 2

符号写： document.onload = ajax call

Answer 3

使用Ajax

使用jQuery Ajax请求方法，您可以将电子邮件数据发布到脚本（submit.php）。当dom准备好时$(function(){ });执行。此外，如果要执行长查询，则可能需要使用“超时”选项。

note - 我建议使用ajax响应对象来确保脚本成功执行。

$(function() {
   $.ajax({
      type: 'POST',
      url: 'submit.php',
      timeout: 10000,
      error: function()
      {
         alert("Request Failed");
      },
      success: function(response)
      {  
         //response being what your php script echos.
      }
   });
});

虽然jQuery绝对不需要做ajax请求，但我强烈建议使用某种框架来帮助确保x-browse支持。

如果您使用的是大型数据集，我强烈建议您使用json对您的repsonses进行编码。它使解析变得非常容易。以下是jQuery $.getJSON() API的示例，以及encode it with PHP

的方法

Answer 4

优化查询或执行AJAX调用。这是一个简单的JS方式做AJAX，我在谷歌搜索中找到了这个脚本并修改为使用回调函数，这样你就可以解析数据或做其他事情，而不仅仅是直接将内容加载到HTML元素：

ajax函数：The Original function I found unmodified

function ajaxRequest(Url, callback) {
  var AJAX;
  try {
      AJAX = new XMLHttpRequest();
  }
  catch (e) {
      try {
          AJAX = new ActiveXObject("Msxml2.XMLHTTP");
      }
      catch (e) {
          try {
              AJAX = new ActiveXObject("Microsoft.XMLHTTP");
          }
          catch (e) {
              alert("Your browser does not support AJAX.");
              return false;
          }
      }
  }
  AJAX.onreadystatechange = function() {
      if (AJAX.readyState == 4) {
          if (AJAX.status == 200) {
              callback(AJAX.responseText);
          }
          else {
              alert("Error: " + AJAX.statusText + " " + AJAX.status);
          }
      }
  }
  AJAX.open("get", Url, true);
  AJAX.send(null);
}

用法：

<div> some normal content </div>
<div id="loadlater">loading data...</div>
<div> more content that loads before the data</div>

<script>
  ajaxRequest('/echo/html/', function( response) {
    document.getElementById('loadlater').innerHTML = response;;   
  });
</script>

这里的工作示例：JSFiddle

在页面加载后如何使用JS执行繁重的PHP函数以加快速度？

4 个答案:

使用Ajax