将javascript进度条与另一​​个javascript结合使用

时间:2014-03-24 12:52:29

标签: javascript jquery

我有一个javascript进度条:

<script>
    $(function() {
        $( "#progressbar" ).progressbar({
            value: 37
        });
    });
</script>

我有另一个自动从文件中获取值的JavaScript:

 <script>
    var time = 0;
    setInterval(function() {
        $.ajax({
            type: "POST",
            data: {time : time},
            url: "fileupdate.php",
            success: function (data) {
                var result = $.parseJSON(data)
                if (result.content) {
                    $('#file_content') .html(result.content);
                }
                time = result.time;
            }
        });
    }, 1000);
</script>

如何将进度条的js添加到此脚本中,以便进度条的值可以自动更新?

提前致谢。

1 个答案:

答案 0 :(得分:1)

你每秒都在呼叫这个请求..这就是你想要的吗?如果没有一遍又一遍地完成,这将堆叠请求..

你应该做什么,按照A.Wolff的建议,每次ajax调用完成时调用该函数..参见下面的代码:

请参阅此博客:http://www.dave-bond.com/blog/2010/01/JQuery-ajax-progress-HMTL5/

function doAjaxCall(){
  $.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;
     //Do something with upload progress
     console.log(percentComplete);
     }
   }, false);
 //Download progress
   xhr.addEventListener("progress", function(evt){
     if (evt.lengthComputable) {
       var percentComplete = evt.loaded / evt.total;
     //Do something with download progress
       console.log(percentComplete);
     }
   }, false);
   return xhr;
  },
  type: 'POST',
  url: "/",
  data: {},
  success: function(data){
     doAjaxCall(); //THIS WILL CALL THE FUNCTION AGAIN IF THE CALL IS SUCCESSFUL.
  }
 });
}