异步文件上传的两种方式

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    <title>文件管理</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<script type="text/javascript" src="<%=path %>/script/jquery-1.4.2.min.js"></script>
	<script type="text/javascript" src="<%=path %>/script/jquery.form.js"></script>
	
	<script type="text/javascript">
		function uploadFile()
		{
			var url = "<%=path %>/file/uploadFileWithMultipartFiles.htm";
			var fm = document.getElementById("fm");
			fm.action = url;
			fm.enctype = "multipart/form-data";
			fm.target = "queryDown";
			fm.method = "GET";
			fm.submit();
		} 
		function jqFormUploadFile()
		{
			$("#fm").form('submit',{url:"<%=path %>/file/uploadFileWithMultipartFiles.htm",
				success:function(data)
				{
					$("#downfile_div").html(data);
				}
			});
		}
		$(function(){
			$("#downfile_div").load("<%=path%>/file/showFiles.htm");
		});
	</script>
  </head>
  
  
  <body>
  	<div style="width: 100%;">
  		<center>
	  		<table width="80%" border="1">
	  			<tr>
	  				<td width="50%" align="center">文件上传</td>
	  				<td width="50%" align="center">文件下载</td>
	  			</tr>
	  			<tr>
	  				<td align="center">
	  					<form id="fm" action="" method="post" enctype="multipart/form-data">
	  						<table>
	  							<tr><td>
						  			<input type="file" name="upfiles">
	  							</td></tr>
	  							<tr><td>
						  			<input type="file" name="upfiles">
	  							</td></tr>
	  							<tr><td align="center">
	  								<input type="button" value="开始上传" onclick="jqFormUploadFile()" />
	  							</td></tr>
	  						</table>
				  		</form>
	  				</td>
	  				<td align="center">
	  					<div id="downfile_div">
	  					
	  					</div>
	  				</td>
	  			</tr>
	  		</table>
  		</center>
  	</div>
	<iframe src="" name="queryDown" id="queryDown" style="display: none"></iframe>	
  </body>
</html>


你可能感兴趣的:(文件上传 异步上传/同步上传)