我按照本教程学习了如何创建DragNDrop文件上传。
它基本上由组成
<form id='dragform'>
<input type="file" name="file[]" id="fileC" class="inputfile" multiple />
<label for="fileC" id='dropLabel'>
</label>
</form>
其中输入被隐藏。
上传由完成
var $form = $('#dragform');
.on('drop', function(e)
{
droppedFiles = e.originalEvent.dataTransfer.files;
$form.trigger('submit');
});
var $input = $('.inputfile');
$input.on( 'change', function( e )
{
$form.trigger('submit');
});
$form.on('submit', function(e)
{
var ajaxData = new FormData($form.get(0));
if (droppedFiles) {
$.each( droppedFiles, function(i, file) {
ajaxData.append( $input.attr('name'), file );
});
}
[...]
});
这意味着有两个上传文件的选项，可以选择也可以删除。在这两种情况下，文件都是使用AJAX直接上传的。现在我的问题来了：
如果我选择file1.pdf，则ajaxData仅包含文件1.pdf。如果我现在在DragNDrop区域中删除file 2.pdf和File 3.pdf则ajax Dataile1.pdf，file2.pdf和file3.pdf但我只希望它包含拖动的文件文件2.pdf和文件3.pdf，因为file1.pdf以前已经上传过。如果我现在选择file4.pdf，则ajaxData包括file2.pdf、文件3.pdffile4.pdf。
我需要更改什么，以便只从表单中获取最后拖动或最后选择的文件？
现在可以工作了：
var ajaxData;
if (droppedFiles) {
ajaxData = new FormData();
$.each( droppedFiles, function(i, file) {
ajaxData.append( $input.attr('name'), file );
});
}
else {
ajaxData = new FormData($form.get(0));
}
droppedFiles = "";