处理Exec_Shell脚本时显示加载图像

时间:2015-10-09 18:05:36

标签: php jquery html css ajax

当script.sh正在加载

时,我需要创建一个带有图像的加载器div

这是我的代码:

<?php
    if (isset($_POST['restartserver']))
    {
         shell_exec("my-script.sh");         
    }    
?>

<html>
<body>
<div class="refresh">
<form method="post">
    <p>
        <button class="button" name="restartserver">Restart Server</button>
    </p>
</form>
</div>
</body>
</html>   

所以当我点击按钮时我需要一个加载图像,当加载脚本.sh时,图像加载器消失,你可以再次点击div中的按钮。

实际上,当我点击按钮时脚本运行正常,但我看到浏览器正在加载脚本,完成后重新加载同一页面。

我只想在加载脚本时想要一个更好的image.gif

我知道这可以用Ajax完成,但我没有找到一个有效的例子

1 个答案:

答案 0 :(得分:1)

使用jQuery轻松实现ajax。以下代码假定重启脚本在重新启动时输出“完成”,以及其他任何错误。

$('#loaderdiv').html('<img src="loader.gif" />');

$.get('http://path.to/restart.php', function(data){
    if (data == "complete"){
       $('#loaderdiv').html('Reboot Complete');
    } else {
       $('#loaderdiv').html('An Error Has Occured');
    }

});

HTML

<div id="container">
    <button id="runscript">Run Script</button>
</div>

的Javascript

$(document).ready(function(){

  $('#runscript').click(function(e){
      e.preventDefault();

      $('#container').html('<img src="loader.gif" />');

      $.get('http://path.to/execute_sh_script.php', function(data){
            // Code here executes once ajax is complete
            $('#container').html('**strong text**');
      });

  });

});