等到jquery函数返回值

Question

我正在使用 jQuery Blueimp 文件上传并尝试在变量中获取上传的文件 json。我将函数称为：

var fileoutput = attachfile(fileobject, ['xlsx','zip'],"tmp");

这将调用函数：

function attachfile(fileobject, allowedfiletypesarray, destinationfolderpath) {
    var allowedFileTypes; 
    allowedFileTypes = allowedfiletypesarray.join('|');
    allowedFileTypes = "/\.("+allowedFileTypes+")$/i";

    $(fileobject).fileupload({
        add: function(e, data) {        
            if(data.originalFiles[0]['type'].length && !allowedFileTypes.test(data.originalFiles[0]['type'])) { 
                $('#fileerror').html('Not an accepted file type'); // show error message
                return false;
            } 
            data.submit();
        },
        url: "uploadcsv.php", 
        dataType: 'text',
        acceptFileTypes : allowedFileTypes,
        formData: {"upload_url":destinationfolderpath},
        done: function (e, data) {
            var fileuploadresult = data.result;
            fileuploadresult = JSON.parse(fileuploadresult); 
            console.log(fileuploadresult);
            return fileuploadresult;
        },
    }).prop('disabled', !$.support.fileInput)
        .parent().addClass($.support.fileInput ? undefined : 'disabled');   
}

现在的问题是，

var fileoutput = attachfile(fileobject, ['xlsx','zip'],"tmp");
console.log(fileoutput);

这是返回undefined。而且我没有从attachfile() 得到回报。 console.log(fileuploadresult); 内的attachfile() 正在正确打印上传的文件详细信息。

所以我尝试添加这样的承诺：

function promisefunction() {
  return new Promise(function (resolve, reject) {
    resolve( attachfile(fileobject, ['xlsx','zip'],'tmp') );
  });
}

promisefunction()
.then(value => {
    console.log("value : "+value);
})
.catch(err =>{
    // handle error
});

但这也会在文件上传之前返回未定义的结果。

谁能帮我解决这个问题。提前致谢。

Answer 1

问题是因为您返回的 Promise 与 blueimp 发出的 AJAX 请求无关。

实现您所需的最简单方法是为您的attachfile() 调用提供一个回调函数，然后在done() 中调用它，如下所示：

var fileoutput = attachfile(fileobject, ['xlsx', 'zip'], 'tmp', function(value) {
  console.log('value : ' + value); 
});

function attachfile(fileobject, allowedfiletypesarray, destinationfolderpath, callback) {
  var allowedFileTypes = "/\.(" + allowedFileTypes + ")$/i";

  $(fileobject).fileupload({
    add: function(e, data) {
      if (data.originalFiles[0]['type'].length && !allowedFileTypes.test(data.originalFiles[0]['type'])) {
        $('#fileerror').html('Not an accepted file type');
        return false;
      }
      data.submit();
    },
    url: "uploadcsv.php",
    dataType: 'text',
    acceptFileTypes: allowedFileTypes,
    formData: {
      "upload_url": destinationfolderpath
    },
    done: function(e, data) {
      var fileuploadresult = JSON.parse(data.result);
      callback && callback(fileuploadresult); // invoke the callback here
    },
  }).prop('disabled', !$.support.fileInput).parent().addClass($.support.fileInput ? undefined : 'disabled');
}