在加载剩余页面内容后加载页面的一部分

我有一个包含许多PHP include语句的html页面。其中一个需要较长时间才能加载。但我想要其余的元素得到更早加载，但想要保持序列在加载剩余页面内容后加载页面的一部分

index.php 
<div id="a1"> 
<? include('a.php'); ?> 
</div> 
<div id="b1"> 
<? include('b.php'); ?> 
</div> 
<div id="c1"> 
<? include('c.php'); ?> 
</div>

我想要保持相同的序列。 b.php需要较长时间才能加载，最终影响整个页面的加载。我想先加载a.php和c.php，然后再加载b.php。如何使用AJAX做同样的事情？

来源

2013-06-26 Deepali

PHP在服务器端执行，所以执行是真的'fast' ..我更喜欢检查哪个代码块在b.php....上花费了很多时间，而不是寻找jQuery/AJAX解决方案 – swapnesh

您可以使用jQuery到其他页面加载到您的HTML页面

<div id="a1"> 
<? include('a.php'); ?> 
</div> 
<div id="b1"> 

</div> 
<div id="c1"> 
<? include('c.php'); ?> 
</div> 

<script type='text/javascript'> 
    $(document).ready(function (e) { 
     $('#b1').load('/path/to/b.php'); 
    }); 
</script>

来源

2013-06-26 04:42:00 DevZer0

<script> 
    $(function(){ 
     $('#a1').load('a.php'); 
     $('#b1').load('b.php'); 
     $('#c1').load('c.php'); 
    }); 
</script> 
<div id="a1"> 
<? include('a.php'); ?> 
</div> 
<div id="b1"> 
<? include('b.php'); ?> 
</div> 
<div id="c1"> 
<? include('c.php'); ?> 
</div>

包含的jquery.js withing你的脚本，如果它不存在。之前

来源

2013-06-26 04:44:50

<? 
$a=false; 
$b=false; 
$c=false; 
?> 
<div id="a1"> 
<? $a = include('a.php'); ?> 
</div> 
<div id="c1"> 
<? $c = include('c.php'); ?> 
</div> 

<? if ($a && $c) { ?> 
<div id="b1"> 
<? include('b.php'); ?> 
</div> 
<? } ?>

然后使用JavaScript，如果你想具体定位

来源

2013-06-26 06:03:47 minhajul

的index.php

<div id="a1"> </div> 
<div id="b1"> </div> 
<div id="c1"> </div> 


<script> 
(function() { 
function ajax(location, element){ 
    var xhr = new XMLHttpRequest(); 
    xhr.onreadystatechange = function() { 
    if(xhr.readyState == 4 && xhr.status == 200) { 
     element.innerHTML = xhr.responseText; 
     return true; 
    }; 
    } 

    xhr.open("GET", location, true); 
    xhr.send(); 
    } 
    if(true) { 
    var a = document.getElementById('a1'); 
    var b = document.getElementById('b1'); 
    var c = document.getElementById('c1'); 
    if(ajax('/a.php', a) && ajax('/c.php', c)) { 
     ajax('/b.php', b); 
    } 
    } 
    })(); 
</script>

来源

2013-06-26 06:06:55

<script type="text/javascript"> 
    $(function() { 
    $('#a1').load('a.php', function() { 
     $('#c1').load('c.php', function() { 
     $('#b1').load('b.php'); 
     }); 
    }); 
    }); 
</script>

来源

2013-06-26 07:21:46 bystwn22

在加载剩余页面内容后加载页面的一部分

回答

相关问题