Question

我使用jquery-file-upload插件上传多个文件，并希望将所有后续的ajax请求（此处未显示）添加到异步库的队列中（主要是因为它似乎是iPhone上的Safari不能很好地处理很多请求，所以我认为一个接一个地喂它们应该更好。因此，我在以下行中定义了fileupload插件的add事件：

return $('#fileupload').fileupload({
  type: 'POST',
  add: function(e, data) {
    q.push(data, function (err) {
      if (err) {
        console.log('failed processing file '+data.guid+': '+err);
        return(false);
      }
    });
  }
});

然后队列定义如下：

var q = async.queue(function (data, callback) {
  var $this = $(this); // needed for triggering jquery-file-upload process event
  data.process(function () {
    return $this.fileupload('process', data);
  }).done(function () {
  return data.submit();
  callback();
}, 1);

但是在运行时我得到了错误：在初始化之前无法调用fileupload上的方法;试图调用方法＆＃39;进程＆＃39; 。

我想这意味着我尝试通过传递数据对象来保留fileupload的范围是不成功的。在我添加async.queue之前，最后一位是在add事件的定义中定义的，它运行正常。

我一直试图阅读javascript函数，但到目前为止我还没有能够解决这个问题。我会很感激任何指示。

谢谢！

Answer 1

请注意，callback永远不会被调用，因为它位于return语句之后，修复：

var q = async.queue(function (data, callback) {
  var $this = $(this); // needed for triggering jquery-file-upload process event
  data.process(function () {
    return $this.fileupload('process', data);
  }).done(function () {
  callback();
  return data.submit();
}, 1);

Answer 2

如果不深入研究文件上传的内部或者有一个例子可以解决这个问题，这真的很难回答，但我认为你应该能够通过一些小的调整来实现这个目标。首先，将@wachme建议更改，因为这是一个问题。其次，将上传对象传递给您的队列：

return $('#fileupload').fileupload({
  type: 'POST',
  add: function(e, data) {
    var params = { uploader: $(this), data: data };
    q.push(params, function (err) {
      if (err) {
        console.log('failed processing file '+data.guid+': '+err);
        return(false);
      }
    });
  }
});

然后，在处理过程中使用该参数：

var q = async.queue(function (params, callback) {
  params.data.process(function () {
    return params.uploader.fileupload('process', params.data);
  }).done(function () {
  callback();
  return params.data.submit();
}, 1);

将javascript范围传递给函数

2 个答案: