jquery - 使用 ajaxSubmit 进行异步调用 - jquery.form

Question

我有一个包含特定操作的表单。提交表单后，我发送一个调用此操作的 ajax 调用。另一方面，我正在发送另一个 ajax 调用来更新进度。我是这样做的:

    $("form").submit(function() {               
      function callBack()
      {
            if( (this.readyState == 4) && (this.status == 200) )
            {
              console.log(this.responseText);
            }
      }

      function updateProgress (){
        asyncReq('/get_progress?progress='+progress, callBack);
      }

      function asyncReq(url, functionCallBack)
      {
            var request; //request must be a local var to avoid race condition
            try
            {   //for modern browsers
              request = new XMLHttpRequest;
            }
            catch (err)
            {// legacy IE
              request = new ActiveXObject("Microsoft.XMLHTTP");
            }
            request.onreadystatechange = callBack;
            request.open("GET", url, true);
            request.send();
      };
      var progress = $("#progress").val();
      asyncReq('/get_progress?progress='+progress, callBack);
      setTimeout(updateProgress, 2000);
      $(this).ajaxSubmit({async: true});
      return false;
   });

我这里有 2 个异步 JavaScript 调用，一个用于提交表单，一个用于更新进度。当我打印出callBack中的responseText时，我只能看到0.0和1.0。这是调用 ajaxSubmit() 之前和完成之后的情况。我也想获得中间进度的所有值(value)。据我了解，对 asyncReq 的第二个 ajax 调用仅在 ajaxSubmit 完成后调用。谁能告诉我如何在 ajaxSubmit() 完成之前进行另一个完整的 ajax 调用？

注意:

该表单由文件字段和ajaxSubmit组成，解压缩、处理文件并在处理每个文件后更新进度表。 get_progress 方法提取该表的进度值。我正在使用jquery.form.js用于通过ajax调用提交表单。

Answer 1

我不清楚你想达到什么目的。但是，这是您的代码的简化版本。

function updateProgress(){
    var progress = $("#progress").val();
    $.get('/get_progress?progress='+progress, function(data){
        //***you will get response in data
        //here you write how to handle progress and data
    }
    setTiemout('updateProgress()', 2000)

}
$('form').submit(function(){
    updateProgress();
    $(this).ajaxSubmit({async: true});
})

我不确定 ajaxSubmit() 函数实际上为您做什么!顾名思义，我想它只是提交表单。现在，如果您想放置自己的逻辑来显示进度，只需将该逻辑放置在 *** 标记区域中即可。