网页中的PHP脚本反馈

时间：2017-04-20 16:38:38

标签： php jquery html css apache

我正在尝试构建一个Web门户，它运行一个php脚本脚本，在Windows中调用批处理文件，然后执行一个运行powercli的powershell脚本从vmware vcenter中获取所需的信息。所有结果都发送到一个名为f1.txt的文件，f1.html来源这个文件并显示输出。我的所有代码都在下面。

以下解决方案有效但是，当f1.php脚本运行并等待基础PowerShell脚本f1.bat - ＆gt;的输出时，我需要显示一些输出而不是空白页面。 f1.ps1。

当网页等待php脚本完成时，会有一些进度报告或来自php脚本的直接反馈。

例如：加载...带有闪烁的点或脚本本身的输出。

我在f1.php中尝试了flush（）方法和ob_flush（）方法，但它只是给了我一个带输出的空白屏幕，一旦php脚本完成运行，导航栏就会在输出下面加载。页面是所有人都受伤了。

如何以最少的代码操作获得所需的结果。如果任务需要ajax或javascript，那么我也可以这样做。

我在index.php中有以下内容

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
.dropdown-submenu {
    position: relative;
}

.dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
}
@media (min-width: 979px) {
ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;
}
}
ul.nav li.dropdown-submenu:hover > ul.dropdown-menu {
    display: block;
}
</style>
</head>
<body>

<div class="navbar navbar-inverse ">
<div class="container-fluid">


            <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">VMware VC Reports</a>
            </div>

                    <div class="collapse navbar-collapse" id="myNavbar">
        <ul class="nav navbar-nav">
        <li class="dropdown"><a class="dropdown" data-toggle="dropdown" href="#">Vcenters<span class=caret></span></a>

            <ul class="dropdown-menu">

        <li class="dropdown-submenu">
            <a class="test" tabindex="-1" href="#">San Jose Vcenter<span class="caret"></span></a>
            <ul class="dropdown-menu">
            <li><a tabindex="-1" href="http://mickey.example.com/view/f1.php">ESX Info</a></li>
            <li><a tabindex="-1" href="http://mickey.example.com/view/f2.php">Firmware Info</a></li>
        </li>
            </ul>

            </li>
            </ul>
        </ul>
                    </div>
</div>
</div>

<script>
$(document).ready(function(){
$('.dropdown-submenu a.test').on("click", function(e){
    $(this).next('ul').toggle();
    e.stopPropagation();
    e.preventDefault();
});
});
</script>

</body>
</html>

我在f1.php文件中有以下内容。

<?php
system("f1.bat");
header("Location:http://mickey.example.com/view/f1.html");
exit;
?>

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
.dropdown-submenu {
    position: relative;
}

.dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
}
@media (min-width: 979px) {
ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;
}
}
ul.nav li.dropdown-submenu:hover > ul.dropdown-menu {
    display: block;
}
</style>
</head>
<body>

<div class="navbar navbar-inverse ">
<div class="container-fluid">


            <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">VMware VC Reports</a>
            </div>

                    <div class="collapse navbar-collapse" id="myNavbar">
        <ul class="nav navbar-nav">
        <li class="dropdown"><a class="dropdown" data-toggle="dropdown" href="#">Vcenters<span class=caret></span></a>

            <ul class="dropdown-menu">

        <li class="dropdown-submenu">
            <a class="test" tabindex="-1" href="#">San Jose Vcenter<span class="caret"></span></a>
            <ul class="dropdown-menu">
            <li><a tabindex="-1" href="http://mickey.example.com/view/f1.php">ESX Info</a></li>
            <li><a tabindex="-1" href="http://mickey.example.com/view/f2.php">Firmware Info</a></li>
        </li>
            </ul>

            </li>
            </ul>
        </ul>
                    </div>
</div>
</div>

<script>
$(document).ready(function(){
$('.dropdown-submenu a.test').on("click", function(e){
    $(this).next('ul').toggle();
    e.stopPropagation();
    e.preventDefault();
});
});
</script>

</body>
</html>

我在f1.html中有以下内容

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
.dropdown-submenu {
    position: relative;
}

.dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
}
@media (min-width: 979px) {
ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;
}
}
ul.nav li.dropdown-submenu:hover > ul.dropdown-menu {
    display: block;
}
</style>
</head>
<body>

<div class="navbar navbar-inverse ">
<div class="container-fluid">


            <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">VMware VC Reports</a>
            </div>

                    <div class="collapse navbar-collapse" id="myNavbar">
        <ul class="nav navbar-nav">
        <li class="dropdown"><a class="dropdown" data-toggle="dropdown" href="#">Vcenters<span class=caret></span></a>

            <ul class="dropdown-menu">

        <li class="dropdown-submenu">
            <a class="test" tabindex="-1" href="#">San Jose Vcenter<span class="caret"></span></a>
            <ul class="dropdown-menu">
            <li><a tabindex="-1" href="http://mickey.example.com/view/f1.php">ESX Info</a></li>
            <li><a tabindex="-1" href="http://mickey.example.com/view/f2.php">Firmware Info</a></li>
        </li>
            </ul>

            </li>
            </ul>
        </ul>
                    </div>
</div>
</div>

<script>
$(document).ready(function(){
$('.dropdown-submenu a.test').on("click", function(e){
    $(this).next('ul').toggle();
    e.stopPropagation();
    e.preventDefault();
});
});
</script>

<script type="text/javascript">
<!--
var iframe = document.createElement("iframe");
iframe.src = "f1.txt";
iframe.width = "20000";
iframe.height = "20000";
iframe.frameBorder = "0";
iframe.scrolling = "no";
document.body.appendChild(iframe);
//-->
</script>

</body>
</html>

0 个答案:

没有答案
相关问题
最新问题