首页 > 解决方案 > 在前端处理多个 PHP 响应(JavaScript 或 HTML5)

问题描述

我想处理从 PHP(从 PHP 中的循环生成的多个回显)到前端(JavaScript 到 HTML5)的多个响应。原因是我在 HTML 页面中有进度条,所以我想根据从 PHP 收到的响应更新进度条。

我尝试过使用 AJAX。我使用 JavaScript 发送 AJAX 请求,但似乎无法为多个响应打开 AJAX 请求。

如果没有 Ajax,我设法将 PHP 响应立即打印到网页,但我想使用 Javascript DOM 处理响应。

PHP代码:

   $proc = popen("$RDir $workingMainRFile $workingDirData $workingDirReport $fileName $workingRFiles " . escapeshellarg($title), 'r');
        //echo '<pre>';

        while (!feof($proc)) {
            $total += strlen(fread($proc, 4096));
            $part = strlen(fread($proc, 4096));
            $current += $part;
            $prec = intval((($current / 185256) * 100));
            if ($prec >= 100) {
                $prec = 100;

            $myObj->prec = $prec;
            echo json_encode($myObj);

            @ flush();
        }

JavaScript 代码:

function getPrec() {
var elem = document.getElementById("myBarText");
    document.getElementById("myBar").style.display = "block";
var form = document.getElementById('formUpload');
    var formData = new FormData(form);
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function () {

        if (this.readyState == 4) {
            if (this.status == 200) {

                var myObj = JSON.parse(this.responseText);

                elem.style.width = myObj.prec;
            } else {

                console.log("Error", xmlhttp.statusText);
            }
        }
    };
    xmlhttp.open("POST", "php/upload.php", true);
    xmlhttp.send(formData);
}

我想使用 JavaScript DOM 处理多个 PHP 响应,如下所示:

var elem = document.getElementById("myBarText");
elem.style.width = myObj.prec;

因此,对于每个响应,我都想更新进度条的宽度。

标签: javascriptphphtml

解决方案


推荐阅读