PHP如何刷新HTML代码中的ProgressBar? [英] How can PHP refresh a ProgressBar in HTML code?

问题描述

我的index.html中有一个表单，该表单在提交时调用jQuery函数. 此jQuery函数会发出AJAX请求以运行PHP脚本.

I have a form in my index.html that calls a jQuery function on submitting. This jQuery function does an AJAX request to run a PHP script.

我希望PHP脚本与HTML交互(目标是刷新进度条).

I want the PHP script to interact with the HTML (the goal is to refresh a progress bar).

我的问题是，在使用AJAX运行PHP脚本时，它是在后台执行的.实际上，我不希望页面在PHP处理期间刷新.

My problem is that in running the PHP script with AJAX, it's executing in background. I don't want the page to refresh during the processing of PHP in fact.

我画了图.

我该如何实现?

推荐答案

我认为您的意思是进度栏应该由上载过程填充.你可以那样做

I think you mean that the progress bar should get filled by an uploading process. You can do it like that

$.ajax({
    xhr: function() {
        var xhr = new window.XMLHttpRequest();

        // Upload progress
        xhr.upload.addEventListener("progress", function(evt){
            if (evt.lengthComputable) {
                var percentComplete = evt.loaded / evt.total;
                $('#progress').text(percentComplete + '%').css('width', percentComplete + '%');
            }
       }, false);

       // Download progress
       xhr.addEventListener("progress", function(evt){
           if (evt.lengthComputable) {
               var percentComplete = evt.loaded / evt.total;
               $('#progress').text(percentComplete + '%').css('width', percentComplete + '%');
           }
       }, false);

       return xhr;
    },
    type: 'POST',
    url: "/",
    data: {},
    success: function(data){
        // Do something success-ish
    }
});

这篇关于PHP如何刷新HTML代码中的ProgressBar?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！