Question

我正在前端处理一种新类型的调查问题，该问题允许用户上传图像文件。鉴于jQuery本身不支持文件上传，我正在尝试使用jQuery File Upload plugin。

我在编写自定义方法时无法通过插件获取文件并将其插入标准的json格式。我们将如何做到这一点：

var url = "sendAnswer.json";
var questionId = 11; //This is set elsewhere
var fileValue = // Need to get the image file here
$.post(url,{
 "data[Answer][question_id]": questionId,
 "data[Answer][value]" : fileValue
});

如何正确设置fileupload中的选项以匹配我需要发送的内容？基本上我需要将上传文件放入数据数组中。默认情况下，我认为它是由插件单独处理的。

Answer 1

首先使用正确的格式创建一个对象，然后传递该对象：

var url = "sendAnswer.json";
var questionId = 11; //This is set elsewhere
var fileValue = // Need to get the image file here
dataObj = {"Answer": {"question_id": questionId, "value": fileValue}};
$.post(url,{
"data": dataObj
});

Answer 2

添加我回答的问题的答案，以防有人试图做类似的事情。您可以通过回调上的data.files获取图像详细信息（例如＆＃34;添加＆＃34;）。

var theUrl = 'url here';
$('#fileupload').fileupload({
        url: theUrl,
        dataType: 'json',
        autoUpload: false,
}).on('fileuploadadd', function (e, data) {
        // Can do things with the data here, "files" has details about the image
        console.log(data.files);
})

使用Blueimp jQuery File Upload插件将文件添加到JSON

2 个答案: