Question

我有一个PHP页面，在加载时执行python脚本，一旦脚本执行，显示页面的其余部分，这是几个div的集合..

<?php

$str = exec('python -u read.py ' . $params, $output);
$str;

echo "welcome";
echo "<div id='div_1'>";
  echo "<div id = 'div_2'>";
  echo "you have finally landed, dude!";
  echo "</div>";
echo "</div>";

?>

问题是脚本需要8到9（或有时12）秒完全执行（通过exec（）函数）..因此，我需要显示一个javascript加载图标，只要脚本执行，然后在脚本完全执行后隐藏它......最简单（也不是最简单）的方法是什么？感谢。

Answer 1

首次加载页面时，请先使用您的html保留此图片。

<img id="img" src="loader.gif">

然后使用此脚本执行php脚本。

$(document).ready(function(){

    var url = "http://link_to_your_php_script";
    $.post(url, { /* You can have variable to post here */ }, function(data){
        if(data=="error"){
        alert("Error,page couldn't be loaded.");
        }
        else{
                  $("#id").html(data);
                }

        });
     $("#img").hide(); //Hide the loading image.

});

将#id更改为#'id of element where you want to place the <div>....</div>'。

您无需更改php脚本。你可以放在php脚本中。

echo  "error";
exit;

如果有错误。

更好的方法是将底部的PHP更改为

echo "welcome
     <div id='div_1'>
           <div id = 'div_2'>
           you have finally landed, dude!
     </div>
    </div>";
exit;

Answer 2

  setTimeout(function(){    
    document.getElementById("div_1").style.display = "none";
    document.getElementById("loading").style.display = "block";
}, 1200);

然后添加以下行

   echo "<div id='loading'>Loding......</div>";

我希望这对你有所帮助，一切顺利！

Answer 3

在<img id="img" src="loader.gif" style="display:none;">

之前添加此行echo "<div id='div_1'>";

<!----------code to show loading image after submitting form, before the content is fully loaded--------------->
<script>
$(document).ready(function() {

$("#form1").submit(function() { //you can assign id to your form and used that id instead of form
$("#img").show();
$("#img").addClass("iimg");
$("div#div_1").hide();
return true;
});

});
</script>
<style>
    .iimg{
        margin-top:150px;
        height:15px;
        width:140px;
    }
</style>
<!-------------------------------------->

在php exec（）执行时显示javascript加载图标

3 个答案: