如何让AJAX为我的进度条设置动画?

时间:2014-03-03 11:18:45

标签: php ajax

我有一个PHP页面,显示1%... 2%..... 3%.....等,带有输出缓冲区。

如何让ajax检测这些更改并使它们反映在进度条的宽度CSS属性中?

$.ajax({
        type: "POST",
       url: "iopio.php",
       success: function(html){ 

         if (html != '100%') {

            $('#mainBar').animate({width:html});
            $('#status').text("Working.");

         }
        }



    });

1 个答案:

答案 0 :(得分:0)

您正在做的是阅读内容一次,因此您每次都会得到一个静态答案,使用这种技术,您可能希望设置循环ping事件以保持更新,如下所示:

function pingProgress(){

    $.ajax({
        type: "POST",
        url: "iopio.php",
        success: function(html){ 

            if (html != '100%') {
                $('#mainBar').animate({width:html});
                $('#status').text("Working.");

                pingProgress();
            }
        }

    });

}
//Start loop
pingProgress();

这专门循环调用函数,直到达到100%。要保存数据,您可以考虑添加超时功能等。