jQuery多文件上传，保留未上传的文件

Question

需要一个一个上传多个文件。假设我一次选择了几个文件并将它们显示在动态生成的表中。我会一一上传，这里做http://blueimp.github.io/jQuery-File-Upload/

单击特定文件的开始后，它会被上传并返回 (RequestDispatcher.include) 到同一页面，但没有以前选择的文件。 但是我需要保留之前请求中没有上传的文件。

我在网上浏览了答案，但对答案不满意。

我认为可能有帮助的一些方法是：

1) 设置 cookie

2) 在发送请求之前临时存储所有文件并将这些文件检索回 jsp 页面。

但我是新手，我对所有答案都感到困惑。 请帮我解决这个问题。

//onclick funtion triggered after clicking start button

function funIndividual(obj,e){

	var $this = $(obj);
    var rowIndex = $this.closest("tr").index();
	var singleFile =$("input[name=hidfileName]").eq(rowIndex).val();
		$('#strMode').val('UploadInd');
		$('#singleFile').val(singleFile);
			$('#fileupload').attr('action','servleturl');
			$('#fileupload').submit();
		}

}

//Snippet to generate the dynamic table
$('#document').ready(function(){
	$('#multipleFiles').on('click',function(){
		if(document.getElementById('multipleFiles').value!=""){
	    	$( "#table tr" ).each( function(){
		  		this.parentNode.removeChild( this ); 
			});
			document.getElementById('multipleFiles').value="";
		}
	});
	
	$('#multipleFiles').on('change',function(){
	    var inp = document.getElementById('multipleFiles');	    	    
	    var table = document.getElementById("table");
	 	for (var i = 0; i < inp.files.length; ++i){	
	 		var fileSize = "";
			var name = inp.files.item(i).name;		  
			
			fileSize = bytesToSize(inp.files.item(i).size);
			var row = table.insertRow(0);
			row.style.backgroundColor = "#FFFFFF";
			row.style.borderBottom ="solid thin gainsboro";
			row.id='trid';
			
			
			var cell1 = row.insertCell(0);
			cell1.style.width = '10px';
			cell1.style.textAlign ="";
			
			var cell2 = row.insertCell(1);
			cell2.style.width = '400px';
			cell2.style.textAlign ="left";
			
			var cell3 = row.insertCell(2);
			cell3.style.width = '300px';
			cell3.style.textAlign ="center";
			
			var cell4 = row.insertCell(3);
			cell4.style.width = '390px';
			cell4.style.textAlign = "center";
			cell1.innerHTML = "<td><span class='preview'></span></td>";
			cell2.innerHTML = "<td align='left'><input type='hidden' id='hidfileName' name='hidfileName' value="+name+"><p class='name'>"+name+"</p><strong class='error text-danger'>"+fileFormatSupported+"</strong></td>";
			cell3.innerHTML = "<td align='center'><p class='size'>"+fileSize+"</p><div style='display:none' id ='progressbar'"+i+" class='progress progress-striped active' role='progressbar' aria-valuemin='0' aria-valuemax='100' aria-valuenow='0'><div class='progress-bar style='display:none' progress-bar-success' style='width:10%;'></div></div></td>";
			cell4.innerHTML = "<td align='center'><span id='btnStartInd"+i+"' name='btnStartInd' class='btn btn-primary start' onclick='javascript:funIndividual(this,event)' "+isValidFile+"><i class='glyphicon glyphicon-upload'></i><span> Start</span></span>&nbsp;<span onclick='javascript:funcancelInd(this,event)' id='btnCancelInd"+i+"' class='btn btn-warning'><i class='glyphicon glyphicon-ban-circle'></i><span> Cancel</span></span></td>"+ "</tr>";
			
			}

	});
});

Answer 1

我遇到了同样的问题，试试看这个

link for multiple upload

尝试阅读教程并下载文件，非常简单且易于更改:-)