Question

我在php中有一个文件，可以下载文件并提取内容。我现在通过创建批处理文件并将其分配给调度程序来定期执行该文件。如何能够弹出一个显示任务文件状态的进度条，如下载，解压缩等等......我只需要在任务执行时显示进度条，比如说每天下午6点......

像这样：http://www.codeproject.com/KB/scripting/loadingbox/load1.JPG

Answer 1

您可以使用.progressbar( "value" , [value] )功能自行设置进度条的进度。

您需要计算出当前流程的加载百分比才能生效。例如，您可能希望显示进度条以预先填充所有图像。

// Define all image locations.
var source = ["apple.jpg", "orange.jpg", "pear.jpg", "banana.jpg"];
// Store HTML image objects in an array.
var imgObj = [];
// Store count of fully loaded images.
var imagesLoaded = 0;

for(var i in source) {
    // Create each image object, assign load function and 'src' attribute.
    imgObj[i] = new Image();
    imgObj.onload = function(e) { imageLoaded(e, source.length);
    imgObj.src = source[i];
}

function imageLoaded(e, loadTotal) {
    // Calculate percent of images loaded, send value to jquery UI element.
    imagesLoaded++;
    $('#myProgressBar').progressbar("value", 100 * (imagesLoaded / loadTotal));
}

Answer 2

将描述文本添加到进度条的代码（如果需要）

  <style>
      .ui-progressbar-text{
        width:100%;
        position:relative;
        top:-17px;
        text-align:center;
      }
  </style>
  <script>
  $(document).ready(function() {
    $("#progressbar").progressbar()
      .append('<div class="ui-progressbar-text" ></div>');
  </script>

脚本wo请求文本文件200ms：

window.setInterval(function(){
  $.get('currenttask.txt', function(data) {
    $('#progressbar')
      .progressbar({value: data.split(";")[0]}) //update the progressbar-value
      .find('.ui.progressbar-text') //update the progressbar-description
        .html(data.split(";")[1])
        .end()
      ;
  });
},200);

文本文件：

--begin of file
"30;extracting"
--end of file

php-script创建一个文本文件，其中一行包含一个值，一个文本代表当前正在执行的任务。

Answer 3

我在其中使用带有微调器gif的模态，当任务完成时，它会通知用户并关闭。

如果你想要一个更复杂的东西作为一个真正的进度条（百分比）jQuery UI有一个进度条小部件，你可以在其中设置进度

.progressbar({ value: x });

jQuery UI模式进度条

3 个答案: