我使用来自https://github.com/blueimp/jQuery-File-Upload
的插件我的脚本加载顺序是:
jquery.js,angular.js,jquery.ui.widget.js,jquery.iframe-transport.js,jquery.fileupload.js,jquery.fileupload-process.js,jquery.fileupload-validate.js,jquery .fileupload-angular.js
我的控制器是:
$scope.profileUploadOptions = {
url: API_URL + "images/user",
maxFileSize: 50,
acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
forceIframeTransport: false,
add: function(e, data) {
$.each(data.files, function (index, file) {
console.log("Added file: " + file.name);
});
console.log(data);
},
start: function(e) {
console.log("Uploads started");
},
stop: function (e) {
console.log("Uploads finished");
},
change: function (e, data) {
$.each(data.files, function (index, file) {
console.log("Changed file: " + file.name);
});
},
progress: function(e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
console.log("Progress: " + progress);
},
progressAll: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
console.log("Progress: " + progress);
},
done: function(e, data) {
console.log("Done: ");
console.log(data);
},
fail: function(e, data) {
console.log("Fail: ");
console.log(data);
},
always: function(e, data) {
console.log("Always: ");
console.log(data);
}
};
如何从浏览窗口浏览单个文件后提交上传,如果文件类型不在acceptFileTypes Regex中,或者大于maxFileSize,我可以处理错误?
答案 0 :(得分:0)
插件documentation应该回答您关于自动上传的问题,并且有一个host of examples很容易找到关于设置问题的文件输入部分的信息。
在提交上传之前验证文件this posed answer, pasted below, is a good starting point。
$fileInput.fileupload({
url: 'upload_url',
type: 'POST',
dataType: 'json',
autoUpload: false,
disableValidation: false,
maxFileSize: 1024 * 1024,
messages: {
maxFileSize: 'File exceeds maximum allowed size of 1MB',
}
});
$fileInput.on('fileuploadadd', function(evt, data) {
var $this = $(this);
var validation = data.process(function () {
return $this.fileupload('process', data);
});
validation.done(function() {
makeAjaxCall('some_other_url', { fileName: data.files[0].name, fileSizeInBytes: data.files[0].size })
.done(function(resp) {
data.formData = data.formData || {};
data.formData.someData = resp.SomeData;
data.submit();
});
});
validation.fail(function(data) {
console.log('Upload error: ' + data.files[0].error);
});
});
使用其他作者的代码,可以在validation.fail
处理程序中实现提供用户反馈。